W3C home > Mailing lists > Public > www-style@w3.org > April 2009

Re: Control over collapsing margins

From: Giovanni Campagna <scampa.giovanni@gmail.com>
Date: Tue, 28 Apr 2009 16:39:23 +0200
Message-ID: <65307430904280739n324823c0qa58d942945c28401@mail.gmail.com>
To: Niels Matthijs <niels.matthijs@internetarchitects.be>
Cc: www-style@w3.org
2009/4/28 Niels Matthijs <niels.matthijs@internetarchitects.be>:
> -----Original Message-----
> From: Giovanni Campagna [mailto:scampa.giovanni@gmail.com]
> Sent: 28 April 2009 15:36
> To: Niels Matthijs
> Cc: Anton Prowse; www-style@w3.org
> Subject: Re: Control over collapsing margins
>
>> For the moment, you can go with overflow:auto on the .box, to make it
>> a BFC and avoid margin-collapsing. You just need to set height always
>> to auto (to avoid overflow).
>
> Not really, because by doing that you'll limit yourself. If I want an
> element inside to be positioned outside of the box (pos:abs; right:-1em
> fe) the overflow will trigger, creating scrollbars.

The overflow should not display scrollbars, if position:static. The
overflow element is not a containing block for absolute positioning.
See for example
data:text/html,<div style="overflow:auto">in flow content<div
style="position:absolute;top:300px;">positioned content

Of course it is a hack, but at least it works most of time.

> I know the ways to "fix" the collapsing margin issue, but I don't see
> why we should keep on fixing it while there is an obvious need for
> standardized control. Especially since there is not one perfect,
> harmless way to fix this.

Well, what you actually need here (if you don't want to go with
padding:0.5em or .box > :first-child hacks) is a BFC, and you can
achieve it with float, overflow, display:inline-block or table-cell,
position:absolute. Float has the additional problem of shrink-to-fit,
overflow shows scrollbars, inline-block is inline and shrinks to fit,
table-cell creates an anonymous table, position:absolute creates
problems with layout of next siblings. There may be other methods I
don't remember.
This is the reason I support the proposal for
"display-model:block-inside" (or "flow:root" or "layout-mode:BFC"),
that creates an explicit flow root.
On the other side, I don't see the necessity for "margin-top-collapse"
/ "margin-bottom-collapse" or even just "margin-collapse" (since we
need margin-left-collapse and margin-right-collapse for Japanese and
Mongolian)

> Greets,
> Niels Matthijs
>
>
>

Giovanni
Received on Tuesday, 28 April 2009 14:40:03 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Tuesday, 22 May 2012 03:46:58 GMT