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

Re: Insufficient margins/padding for list-items/quotes/etc. next to floats

From: James Hopkins <james@idreamincode.co.uk>
Date: Sun, 27 Dec 2009 00:40:56 +0000
Cc: www-style@w3.org
Message-Id: <6D7CE753-0641-4B09-B180-1206BD842BF0@idreamincode.co.uk>
To: Aryeh Gregor <Simetrical+w3c@gmail.com>
> Look at the following document:
> data:text/html,<!doctype html><div style="float:
> left;padding:1em;margin:0 1em 1em 0;border:1px solid
> black;height:5em">Floated text</div><ul><li>Badly-displayed
> bullet</li></ul><p>A paragraph.</p><ul
> style="clear:left"><li>Properly-displayed bullet</li></ul><p>Another
> paragraph</p>
> The first bullet looks wrong: it's not indented relative to the
> surrounding text.  This is because the extra padding is left behind
> the float, and doesn't actually push the text (or bullet) out past the
> surrounding text.  This problem arises pretty commonly on Wikipedia.
> Currently there's no good solution that I can think of.

This happens since the marker box is appearing outside of the  
principal box. You could set the marker box so that it appears as the  
first inline box within the principal box, by applying 'list-style- 
position:inside' - or I may not be understanding your issue correctly?
Received on Sunday, 27 December 2009 00:41:27 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:38:31 UTC