W3C home > Mailing lists > Public > www-style@w3.org > January 2012

Re: [CSS21] BFC may become narrower and collide with a previous float

From: Alan Gresley <alan@css-class.com>
Date: Fri, 27 Jan 2012 21:22:14 +1100
Message-ID: <4F227AD6.6010502@css-class.com>
To: fantasai <fantasai.lists@inkedblade.net>
CC: "www-style@w3.org" <www-style@w3.org>
On 26/01/2012 6:07 PM, fantasai wrote:
> Dear Layout Engineers,
>
> http://lists.w3.org/Archives/Public/www-archive/2012Jan/att-0035/foo.html
>
> Really?

Yes.

> <style>
> #a { float: left; }
> #b { float: right; }
> p { width: 100px; height: 100px; }
> div { width: 190px; }
> </style>
>
> <div>
> <p id=a>FLOAT LEFT</p>
> <p id=b>FLOAT RIGHT</p>
> <table><tr><td>table table table table table table table table</table>
> </div>
>
> +------------------------+
> |+------------+ +-------+|
> || FLOAT LEFT | | table ||
> || | | table ||
> |+------------+ | table ||
> | +------------+|
> | |FLOAT RaGlT ||
> | | table ||
> | +------------+|
> | | table ||
> | +-------+|
> +------------------------+
>
> Sad-face,
>
> ~fantasai

I don't understand why this is sad. How would you expect that test case 
the render.

Elements with display properties such as 'table', 'table-cell' and 
'table-row' behave this way around floats. They share the similar 
behavior as elements with overflow 'auto' and 'hidden' around floats.

The elements shrink to fit beside the float first in the source and 
flows under the second float since this later float it is forced down by 
the earlier float (due to 9.4.1). The line boxes (with table repeated) 
are painted above the second float.

This has happens in Gecko, Opera, WebKit.

IE8, IE9 and IE10 preview 2 shows the element below the first float.

The same behavior for all browsers mentioned is seen in the test case.

http://css-class.com/test/css/visformatting/floats-with-block-elements2.htm



-- 
Alan Gresley
http://css-3d.org/
http://css-class.com/
Received on Friday, 27 January 2012 10:23:01 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:49 GMT