PDA

View Full Version : why is my wrapper is misbehaving?


dsnyder
10-18-2007, 01:52 AM
Can't figure out why my #homewrapper isn't wrapping itself around the two div's within it. Can anyone tell me what's going on?

http://cellocelli.com/hometest.htm

my #leftholder isn't staying within the two div's around it either. I must be missing something very basic?

#homewrapper {text-align:center; margin: 0px auto; width: 740px; border: 1px solid #758279; background-color: #fff; padding:10px;}
#container {width:98%; border: 1px solid #d1d1d1;}
#leftholder{width:31%; float:left; margin: 5px 0px 5px 5px; background-color:#CCCCCC;}

<body>

<div id="homewrapper">
<div id="container">
<div id="leftholder">&nbsp;</div>

</div>
</div>
</body>Thanks!

edbr
10-18-2007, 03:51 AM
#homewrapper {text-align:center; margin: 0px auto; width: 740px; border: 1px solid #758279; background-color: #fff; padding:10px;}
#container {
width:98%;
border: 1px solid #d1d1d1;
position: relative;
}
#leftholder{
width:31%;
float:left;
position: relative;
margin: 5px 0px 5px 5px; background-color:#CCCCCC;}

domedia
10-18-2007, 12:42 PM
If a container only contains floated elements, it won't wrap visually around the floated element. The 2 CSS lines you need to add for IE and FF is:

#homewrapper {
height: 1%;
overflow: hidden;
}

dsnyder
10-18-2007, 01:39 PM
Thanks Domedia. I used that in my CSS before and forgot. All is now behaving nicely.