Sent by Philippe Wittenbergh on 17 July 2004 05:05
On Jul 17, 2004, at 10:04 am, Michael Ryznar wrote:
> [...]
>
> http://dev.l-c-n.com/_temp/collapsing_margins21.php
> *See Test 3*
> I thought this was a good example of "margin collapse" between a
> non-floated div and a floated div. In other words I thought it was an
> example of the pink div's top-margin "collapsing". But now I see it is
> probably more correct to just say that the top margin of the pink div
> "slides under" the bottom margin of FloatB rather than use the term
> "margin-collapse". I guess it is just a matter of terminology. Am I
> correct in this? Should we call this behaviour "margin collapse" or
> "margins sliding under floats"? (PS Lets not consider Opera7 on this
> because as mentioned earlier, Opera7 renders the space incorrectly.)
Sliding under floats sounds like an adequate description. A test file I
sent to Michael off list
<http://dev.l-c-n.com/margin_collapse/collapsing_margins23.php>
which hopefully clarifies this. If one zooms in and out, notice the
different distance between the floated block and the following non
floated block, esp test2, but also test 3 and 4. Those last 2 test
should always have a minimum distance of 25px.
**note**
I moved all test files mentioned in this thread to a permanent
location, starting from:
<http://dev.l-c-n.com/margin_collapse/>
and linked from there
> [...]
>
> I saw this used somewhere and now I am beginning to see how important
> it is to hide "font-size: 1px" from Gecko.
Summary - to clear a floated element in Gecko, make sure that the
clearing element has real content, and some decent font size, only
serve the {font-size:1px} 'hack' to IE win.
>
> In response to Phillipe's question: Yes, if you set the minimum font
> size in Mozilla to be 10px, then font-size:1px will works in clearing
> divs for Gecko.
>
> [...]
>
> Unfortunately, it appears Opera6 mac (windows too maybe) does not
> follow this specification. It places the *margin edge* of the block
> rather than *the border edge of the block* even with the bottom outer
> edge of the lowest float that must be cleared. Another way to
> describe this: Opera7 adds the extra margin-top value (required for
> clear to function) to the current margin value. This results in more
> spacing in Opera6 than the other browsers.
>
> As noted earlier in this thread Opera7 acts strangely too with
> vertical margins after floats.
If one wants absolute control (cross browser) over the distance between
2 blocks when one is floated: float everything. But beware of margins
on elements nested in the (floated) blocks.
Philippe
---/---
Philippe Wittenbergh
now live : <http://emps.l-c-n.com/>
code | design | web projects : <http://www.l-c-n.com/>
IE5 Mac bugs and oddities : <http://www.l-c-n.com/IE5tests/>
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
