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

Re: Control over collapsing margins

From: Aryeh Gregor <Simetrical+w3c@gmail.com>
Date: Tue, 28 Apr 2009 09:39:59 -0400
Message-ID: <7c2a12e20904280639s335f0e4eh537513283291b30c@mail.gmail.com>
To: Niels Matthijs <niels.matthijs@internetarchitects.be>
Cc: Anton Prowse <prowse@moonhenge.net>, www-style@w3.org
On Tue, Apr 28, 2009 at 9:09 AM, Niels Matthijs
<niels.matthijs@internetarchitects.be> wrote:
> The real world examples are quite simple. Whenever you have a visual box
> only separated by background color (fe, body bg is black, box bg is
> #666) the intended results fails when elements within the visual box are
> positioned using margins.

I had exactly this problem just a couple of days ago.  The setup was basically:

<style>
.announcement { color: white; background: darkred; margin: 1em; width: 100%; }
</style>
<div class="announcement">
<p>Some text goes here!</p>
<p>Some more text here!</p>
</div>

The text in the paragraphs ran right up to the top and bottom of the
red box, which looked very ugly.  I fixed it by adding "padding:
0.001px;" to the .announcement rule -- ugly, but it seemed to work.  I
don't know if there's a nicer way right now that doesn't have side
effects.  Creating a new BFC would do all sorts of stuff, probably
including things I didn't want.
Received on Tuesday, 28 April 2009 13:40:36 GMT

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