Testing display:table; in Internet Explorer
Internet Explorer 7 is a great improvement on the browser, with a lot of support. But one thing they didn't release was support for the display:table CSS property.
Below the ad you will see a table and a div. In Firefox, Opera, and Safari the two boxes display nearly identically (Since I didn't modify the cellspacing and cellpadding, they are a little different). But in Internet Explorer, the div takes up the full page, and the table takes up only the space it uses.
Table
When rendered, this box is exactly
as wide as it needs to be.
|
<table>
<tr>
<td style="background:#cfc;border:double #c8c 5px;padding:0 1em">
When rendered, this box is <em>exactly</em> <br/>as wide as it needs to be.
</td>
</tr>
</table>
Div
When rendered, this box is exactly
as wide as it needs to be.
<div style="background:#cfc;border:double #c8c 5px;padding:0 1em; display: table;">
When rendered, this box is <em>exactly</em> <br/>as wide as it needs to be.
</div>
Jennifer Kyrnin
| 
| 