Nested lists and blank lines

Lou Quillio public at quillio.com
Fri Oct 12 15:38:10 EDT 2007


David Reimer wrote:

> When I use nested lists -- it doesn't matter whether <ol> or <ul>,

> there is always a blank line forced after the second level list is

> complete before returning to level one. Examples:


It's a CSS issue, not a markup issue. If you're using browser
defaults, you're most likely seeing a default `margin-bottom: 1em;`
on <ul>s and <ol>s.

When you have a single list, that margin-bottom is probably expected
and therefore unnoticed; with nested lists it's noticeable, and
perhaps undesirable.

There are lots of ways to fix it, some quite exotic. Here's a
simple one:

ul ul,
ol ol,
ul ol,
ol ul {
margin-bottom: 0;
}

This sets a zero margin for the bottom of any list (excluding
definition lists) contained within another list.

Generally, it's best to zero all whitespace defaults and apply your
own instead. User-agent defaults are unreliable.

http://leftjustified.net/journal/2004/10/19/global-ws-reset/
http://developer.yahoo.com/yui/reset/

LQ


More information about the Markdown-Discuss mailing list