IE & <DIV> with CSS - width and height of 100%

When using <DIV> with width and/or height of 100% in IE and it doesn't expand as expected,
try using a <TABLE> to wrap around that <DIV> and set the style of the <TABLE> to have width and/or height to be 100%.
 
I had this problem when using <DIV> without <TABLE> wrapping around it on IE7 - no problem in Firefox though.
The height of the <DIV> doesn't expand to 100% as set.
Wrapping around it with <TABLE> solves this problem.
However, it shrinks the width a bit so I need to set width to 100% as well.
 
In the case of multicolumns layout, some <DIV> might not expand vertically to the height of the longest column.
Wrapping it with another <DIV> and adding a <DIV> with style of {clear: both;} right before closing the wrapper should do the work.
Below is an example:
<div class="contentwrapper">
    <div class="leftcolumn"></div> <!-- float left -->
    <div class="rightcolumn"></div> <!-- float right -->
    <div style="clear: both;"></div>
</div>
This should work for both Firefox and IE :)
Bookmark and Share