Differences between Firefox and IE browsers in CSS style sheets

1 CSS styles for Firefox IE6 IE7

Now most are using!important to hack, for IE6 and Firefox test can be normal display, but IE7 to!important can be correctly interpreted, will cause the page did not appear as required! Find a good hack way for IE7 is to use the "*+html", now use IE7 to browse, there should be no problem.

Now write a CSS can do this:

#1 { color: #333; } /* Moz */
* html #1 { color: #666; } /* IE6 */
*+html #1 { color: #999; } /* IE7 */

Then in Firefox font color display for #333,ie6 under the font color display for #666,ie7 under the font color display as #999.

2 centering problems in CSS layouts

The main style definitions are as follows:

body {TEXT-ALIGN: center;}
#center { MARGIN-RIGHT: auto; MARGIN-LEFT: auto; }

Description

First, the parent element defines text-align:center, which means that the content within the parent element is centered, and for IE this setting is OK.

But you can't center in Mozilla. The solution is to add "Margin-right:auto" when the child element definition is set; Margin-left:auto; ”

What needs to be explained is that if you want to use this method to make the entire page centered, it is recommended not to be nested in a div, you can split out a number of Div, as long as in each split div defined margin-right:auto; Margin-left:auto; It's OK.

3 box models differ explained.

#box{
　 width:600px;
　　　　 //for　 ie6.0-　 width:500px;
　　　 //for　ff+ie6.0
}
#box{
　 width:600px!important
　　　　　　 //for ff
　　 width:600px;
　　　　 //for　ff+ie6.0
　　 width /**/:500px;
　　　 //for　 ie6.0-
}