|
|
Posted by Ben C on 10/19/06 07:06
On 2006-10-18, X l e c t r i c <Xlectric@webtv.net> wrote:
> I don't know why the absolute positioning is necessary.
It was to get shrink-to-fit width on the <ul>. Your divs are nicely
centered, but you had to set widths on them. If they were width: auto,
they'd fill the whole containing width.
> This works for Explorer, Firefox, Netscape, and Opera:
>
> http://www.xlectric.com/temp/centertest.html
>
> And with that I don't know why I had to use float-right for #d4. I
> thought the float-left for #d3 would be enough.
If you remove the float: right for #d4 what happens is #d3 floats left,
and then #d4 starts a new block box, below the anonymous block box
contanining #d3.
Floats that overflow the block box in which they originate appear on top
of subsequent block boxes (and their inline content has to flow around
them). This is explained in the CSS 2.1 spec in the section on floats and
also see the section on stacking levels which explains why #d3 is on top of
#d4 even though #d3 appears earlier in the document.
#d3 does overflow its own (anonymous) block box and so ends up on top of
#d4. #d4 is 400px px wide, #d3 only 200px, so you see half of #d4
sticking out from behind #d3.
Navigation:
[Reply to this message]
|