On Mon, Oct 17, 2011 at 4:08 PM, Philippe Wittenbergh <e...@l-c-n.com> wrote:
>
> On Oct 17, 2011, at 4:40 PM, Ghodmode wrote:
>
>> I have a problem where a DIV is behind a floating element. Given the
>> following code, the DIV.banner appears behind the DIV.logo_block at
>> the left edge of the page.
>>
>> I've discovered that setting overflow:auto on div.banner fixes the
>> problem, but I don't know why. Can someone help me to understand why
>> this is happening?
>
> 'new block formatting contexts'
> http://www.w3.org/TR/CSS21/visuren.html#block-formatting
That didn't do me any good. It doesn't say anything related to the
scenario I've described and doesn't help me understand it.
It does have a link to an explanation of the visual formatting model,
though. It states the following:
> The border box of a table, a block-level replaced element, or an
> element in the normal flow that establishes a new block
> formatting context (such as an element with 'overflow' other
> than 'visible') must not overlap the margin box of any floats in
> the same block formatting context as the element itself. If
> necessary, implementations should clear the said element by
> placing it below any preceding floats, but may place it adjacent
> to such floats if there is sufficient space. They may even make
> the border box of said element narrower than defined by section
> 10.3.3. CSS2 does not define when a UA may put said element next
> to the float or by how much said element may become narrower.
To me, this sounds like the edge of the DIV.banner must not overlap
the edge of the DIV.logo_block, even though that seems to be exactly
what's happening. But, like I said, there's something I don't
understand.
A DIV is "an element in the normal flow that establishes a new block
formatting context" and its default overflow value is 'visible',
right? So the preceding floated element should be cleared and the
DIV.banner should be placed adjacent to it because there is sufficient
space.
So, what do I have wrong?
Thank you.
> Philippe
> --
> Philippe Wittenbergh
> http://l-c-n.com/
--
Ghodmode
______________________________________________________________________
css-discuss [css-d@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/
