i have a simple markup with a navigation div, a content div and a footer div.
If I open my “page”, everything seems okay. But if I open the page and then resize the browser window to e.g. 30%, then the content div slides down.
It seems only to occur in internet explorer.
The test markup:
<html>
<body>
<div id="container">
<div id="navi" style="float:left;width:197px;background-color:blue;">
NaviContent
<br /><br />
more NaviContent
</div>
<div id="content" style="width:820px;background-color:yellow">
<table>
<tr>
<td>Content
<br /><br />
more ContentContent
<br /><br /><br /><br />
<br /><br /><br /><br />
more ContentContent
<br /><br /><br /><br />
<br /><br /><br /><br />
more ContentContent
</td>
</tr>
</table>
</div>
<div id="footer" style="clear:both;">
Footer Content
</div>
</div>
</body>
</html>
Images of the problem:
browser in 100% view:
http://www.suckmypic.net/25729/1.png
browser window resized: http://www.suckmypic.net/25730/2.png
Please help
You need to give your #container a width