IE Window resize cauing div to drop [Archive]

cowdogs

07-27-2006, 06:27 PM

I have tried a couple of different hacks that I found on the web... but i couldn't get them to work... prolly cause I did it wrong.. but here's my problem:

http://www.flogster.com/newtemplate.php

in FF when the windor is resized, it's fine.. the "content" div remains aligned with the "leftnav" div...

But, in IE, the "content" div drops below the "leftnav" div.. and its truely trying my patience!!

Here's my CSS (basic layout stuff anyway):

#container
{
width: 96%;
margin: 5px 2px;
background-color: #fff;
color: #333;
border-left: 3px solid #FF6100;
line-height: 130%;
}

#top
{
padding: 0px;
background-color: #fff;
}

#top h1
{
padding: 0;
margin: 0;
}

#leftnav
{
float: left;
width: 140px;
margin: 0;
padding: 0em;
}

#content
{
margin-left: 170px;
padding: 15px;
width: 600px;
}

#products
{
clear: both;
margin: 0;
padding: 0em;
}

#footer
{
clear: both;
margin: 0;
padding: 0em;
}

#leftnav p { margin: 0 0 1em 0; }
#content h2 { margin: 0 0 .5em 0; }

My HTML goes like this:

<body>
<div id="container">
<div id="top"><? include("header.htm") ?></div>
<div id="leftnav">
*** Text in the leftnav.. code all removed ****

</div>

<div class="body" id="content">

*** Stuff removed... This stuff would be lined right next to the leftnav div ***
</div>
<div id="products">
***this div is located below the leftnav & content div's - lots of content code removed to save space ***
</div>
<div id="footer"><? include("footer.htm") ?></div>
</div>
</body>

What should I be doing differently to keep everyone happy and aligned when the brower window is resized... FF does it correctly... IE doesn't (why doesn't that surprise me)

Any help would be muchly appreciated!!

Jen