- From: Aryeh Gregor <Simetrical+w3c@gmail.com>
- Date: Tue, 28 Apr 2009 09:39:59 -0400
- 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 UTC