Re: [CSS21] 9.5.1: placing floats above earlier blocks & line boxes

Peter Moulder wrote:
> On Thu, Oct 14, 2010 at 04:20:21PM +1100, Alan Gresley wrote:
>> Peter Moulder wrote:
>> [snip]
>>> I must say that as someone without much CSS authoring experience, I can't say
>>> I like the idea of allowing floats to overlap previous text, and I have
>>> difficulty seeing the use cases.  I'd have thought it easy enough to implement
>>> rule 6 as written (though I'll grant it nevertheless does have some
>>> implementation cost compared to the behaviour I see implemented).
>> Firstly the floats do not overlap previous text.
>> [Rather, the previous text overlaps the floats.]
> 
> Sorry for creating misunderstanding: I was intending "overlap" as a symmetric
> relation defined solely in terms of x,y axes, and didn't intend to convey
> anything about z axis.


More precisely it's painting order.


> In terms of z axis, the float occludes backgrounds & borders of earlier blocks
> (and more generally items 1–4 of zindex.html), and is occluded by inline-level
> boxes of earlier blocks (and more generally items 6–10 of zindex.html).


Yes, correct.


>> BTW, what do you think having a top
>> negative margin does to the layout?
> 
> I believe Alan Gresley's point here is that large negative margins do have
> their uses, and that these uses may well involve use of floats.


No, I'm simply saying that a block that has a negative top margin 
causes that block and any following block to be moved upwards by 
height of the negative top margin. You have introduced a ripple or 
fold in the canvas. Like so.

_____________
  |
  |
\|/       ________
  |   ^   |Block with Float
  |   ^   |
\|/  ^  \|/
-------- |
          |
         \|/


Negative margins are cool when they work. Load up the following test 
case in any good browser. The block with a negative top margin has a 
blue top border. The block before this element (with negative margin) 
  has a orange bottom border.


<http://css-class.com/test/bugs/ie/5~7/painting-negative-margins.htm>


Now take a look at the same test in IE7. The clearing block compounds 
the bug and causes the last silver box to become unstable (pee-ka-boo 
activity). After this point, the layout is crippled. How many web 
designers would use this technique if wanting to support IE7?



> [And no, I can't say I know what those uses are, and would ignorantly think
>  that tables or floats would work at least as well...  Hence the two
>  disclaimers of ignorance in CSS authoring in my initial message.]
> 
> pjrm.


I should add that what happens with negative margins is in the spec 
for 9.5.

   | A float can overlap other boxes in the normal flow (e.g., when
   | a normal flow box next to a float has negative margins). When
   | this happens, floats are rendered in front of non-positioned
   | in-flow blocks, but behind in-flow inlines.



-- 
Alan http://css-class.com/

Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo

Received on Thursday, 14 October 2010 14:07:33 UTC