Trevor Nicholls wrote:
> Hello
>
> Can somebody please explain why the lower margin of my first para and the
> upper margin of my "fragment" div are not collapsing? How could I fix this?
>
> I've seen this gap in both IE7 and FF3. The target market is IE6+.
>
> Thanks in advance
> Trevor
[...]
Hello Trevor.
The margins you mention will not collapse since float:left declared on
div.fragment creates a new block formating context [1]. The specs says
that vertical margins between a floated box and any other box do not
collapse [2]. I would remove the margin from div.fragment completely and
just give one margin-bottom.
div.fragment {
float: left;
/* margin: 1em 0 1em 0; */
margin-bottom: 1em;
}
1. <http://www.w3.org/TR/CSS21/visuren.html#block-formatting>
2. <http://www.w3.org/TR/CSS21/box.html#collapsing-margins>
--
Alan http://css-class.com/
Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
______________________________________________________________________
css-discuss [cs...@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/
