Ar 02/06/10 19:56, ysgrifennodd Michael Beaudoin :
> Thanks to all for the help, but this one is escaping me...
>
> I have the following div's:
>
> <div id="page-wrap">
>    <div id="header">
>    <p class="headHead">header</p>
>    <p>header copy</p></div>
>
>      <div id="content">
>        <div id="leftNav"><p>left nav here</p>  </div>
>          <div id="main"><p>main content here</p></div>
>      </div>
> </div>
>
> and I would like a background behind the content area, but when I put
> it in the page-wrap, it won't show behind the leftNav and main areas.
>
> The leftNav is floated left, and the main is floated right.
>
> What am I missing? I'm sure it's head-slapping simple.
>
> Thanks,
> Michael
> ______________________________________________________________________
>
>    

Heh!  Yes it is - if I understand you correctly.

Floats are not content in the same way as un-floated blocks are.  So, 
your #page-wrap contains the #header, whose height is determined by the 
height of the two paragraphs it contains.  You then have a #content div 
that follows the second paragraph but has no height at all because it 
has no non-floated content.  Your floated divs float over this div and 
therefore display no background but their own.

If you use Firefox's Web Developer's Toolbar and get it to outline block 
elements you'll see what I mean.

Cheers


Peter

-- 
http://www.peredur.net

______________________________________________________________________
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to