List Hints

[Tami]

Sometimes, your list items contain entire paragraphs of text, and you want to give each item a little breathing room. In the old days of presentational markup, you might cheat this by adding a line break after all but your last list item:

[code]<ul>
 <li>List item<br></li>
 <li>List item</li>
</ul>[/code]

Nowadays, any good designer should run screaming from this practice. Instead, you can apply a margin to your list items with a little CSS:

[code]<style type="text/css">
/* This should go in an external CSS file */
ul.para li {
 margin-top: 1em;
 margin-bottom: 1em;
}
</script>
<ul class="para">
 <li>List item</li>
 <li>List item</li>
</ul>[/code]

This will work just fine, but it turns out HTML provides its own semantically correct solution. If your list items contain paragraphs of text, why not just mark them up as such?

[code]<ul>
 <li><p>List item</p></li>
 <li><p>List item</p></li>
</ul>
List item

List item[/code]

List items are among a select few HTML tags that can contain either inline tags or block tags. Other tags that can do this include

[code]<div>, <td>, <th>, <ins>, <del> and <dd>.[/code]

source: SitePoint.com newsletter