Box Model Hack - css-discuss

Box Model Hack - css-discuss

If you design using CSS you will have come across the Box Model Hack before. The joys.

This page lists some popular hacks to get around the fact that versions of IE before IE6/strict use a different box model. In that model, the padding and borders are counted as part of any assigned 'width' or 'height'.

I am considering using the following solution from this page:

div
{
border: 10px solid;
padding: 10px;
width: 100px !important;
width /**/:140px;
}

Line 5 is read by all browsers. But IE/Win does not implement !important so this value is not given any importance by that browser. Line 6 is hidden only from IE6/Win. Therefore, IE5.x/Win and any other browser that does not properly implement !important will get a width of 140px.

However the following warning is included:

Is this the ultimate solution? It does break the Konqueror on Linux, and What's the difference between these, and where do they not work? It seems like Technique 3 is a nice solution, but is it the ultimate solution? On NS4.8 all the boxes gets broken into small boxes around each word.

Anyone got any comments on this issue?