Set List Bullets Position
By Stephen Bucaro
Use the list-style-position property to set the position of the
list's bullets. The default value, outside causes the list items
text to be indented, so when text wraps it does not go below the bullet.
list-style-position:outside;
- Item Number One Item Number One Item Number One Item Number One Item Number One
- Item Number Two Item Number Two Item Number Two Item Number Two Item Number Two
- Item Number Three Item Number Three Item Number Three Item Number Three Item Number Three
<ul style="list-style-position:outside;">
<li>Item Number One Item Number One Item Number One Item Number One Item Number One</li>
<li>Item Number Two Item Number Two Item Number Two Item Number Two Item Number Two</li>
<li>Item Number Three Item Number Three Item Number Three Item Number Three Item Number Three</li>
</ul>
The value inside causes the bullet to be placed where the first
character of text would go, so the text wraps underneith the bullet.
list-style-position:inside;
- Item Number One Item Number One Item Number One Item Number One Item Number One
- Item Number Two Item Number Two Item Number Two Item Number Two Item Number Two
- Item Number Three Item Number Three Item Number Three Item Number Three Item Number Three
More CSS Quick Reference: • Set the Letter Spacing • Set the Font Slant • Indent the First Line of Text • Set an Element's Float • Use Inline Style • Pseudo-class Selectors • Set a Background Image • Define CSS Rollover Effects • Set the Font Size • Set an Element's Visibility
|