Differences in padding and margin between browsers_Experience exchange

Margin and padding may always be used, but how to solve the problems caused? Because browsers interpret container widths in different ways:
IE 6.0 Firefox Opera, etc. are
Real width=width padding border margin
IE5.X
Real width=width -padding-border-margin

The solution is:

div.content {
width:400px; //This is the wrong width, all browsers read it
voice-family: "\"}\""; //IE5.X/win Ignore the content after "\"}\""
voice-family:inherit;
width:300px; //Some browsers including IE6/win read this sentence, the new value (300px ) overwrites the old one
}
html>body .content { //html>body is the writing method of CSS2
width:300px; //Browsers (non-IE5) that support CSS2 writing method are lucky enough to read this sentence# ##}

div.content {

width:300px !important; //This is the correct width. Most browsers that support the !important tag use the value here
width (space)/**/:400px ; //IE6/win does not parse this sentence, so IE6/win still thinks that the value of width is 300px; while IE5.X/win reads this sentence, the new value (400px) overwrites the old one because of the !important tag Doesn't work for them
}
html>body .content { //html>body is the way CSS2 is written
width:300px; //The browser that supports CSS2 is lucky enough to read this sentence
}##

#Small