Unordered List <ul>

Block-level/Inline?:Block-level (should only contain <li>s as children).
Empty?:No

An Unordered List, <ul>, represents an unordered list of items, which you can think of as a sack of items (<li>s to be exact.) that have no real order. If there is to be a real or implied order then an ol is likely to be more appropriate (remember: just because it looks right on the page doesn't mean it's right).

Nesting Lists

When you nest lists, i.e. when a list has a list inside it, you cannot break the rule that a list's only children are <li>s. This is really easy to "get around" once you realize that <li>s can have all sorts of children (more that one at a time even).
Note: There are examples in the book that do not nest lists properly.

nested List

In the above image we see how to fix an unordered list that has sublists. The quick and easy fix is to move the previous closing <li> tag to after the list, if the item before the list is really a label for the list. Sometimes, I see people put the list in its own <li> but this is unnecessary and probably a little wrong unless the list has no relation to the previous item (normally, lists have some sort of label, so this is uncommon).

Pop Quiz(for absolutely no credit): What is wrong on the above image? (click for the answer-- uses JavaScript)

See also list-style, list-style-type, and list-style-image
Back to Knowledge Dump