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 Text Color • Set List Properties • Set an Element's Padding • Context selectors • nth-child Selector • position:fixed • Set the Type of Bullet Used in List • Use Image for List Item Bullets • Set the Border Color • Set the Background Color
|