January 20, 2005

Tantek Celik's IE5 CSS1 Box Model Hack

Tantek Celik's IE5 CSS1 Box Model Hack

To achieve an equal width of 120px in all browsers,

Add border and padding values to text width and specify the sum (130px) as the width for IE5
(120px content width + 5px left padding + 5px right padding = 130px)

Other browsers interpreting the CSS box model correctly would identify the width as 120px from the last line of the following #container code.

However the html>body line is required for Opera5 which gets the box model wrong but understands the CSS2 Child Selector '>' correctly.

#container{
padding:5px;
width:130px;
voice-family:"\"}\"";
voice-family:inherit;
width:120px;
}
html>body #navigation{width:120px;}

More Details: here at tantek.com

No comments: