Default List Styling

Browsers apply default styles to list elements. Understanding these defaults is essential before applying custom CSS.

format_list_bulleted

Unordered & Ordered Lists

arrow_right margin-top/bottom: 16px (1em)
arrow_right padding-left: 40px (2.5em)
arrow_right list-style-type: disc (ul) / decimal (ol)

Browser Default Example

  • First list item
  • Second list item
  • Third list item
format_list_numbered

List Items & Description Lists

arrow_right List items (li): No default spacing
arrow_right Description term (dt): margin: 16px 0
arrow_right Description (dd): margin-left: 40px

Description List Example

Term
Description of the term
Another Term
Description of another term
lightbulb Pro Tip

Use CSS reset or normalize.css to create consistent styling across browsers before applying your custom list styles.