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:
• position:relative
• Set a Background Image
• Set the border-collapse
• Set List Properties
• Use word-wrap Property to allow Line Breaks in the Middle of Words
• Set an Element's Overlap (z-index)
• Set the Text Color
• Set the Type of Bullet Used in List
• Use Image for List Item Bullets
• CSS background-origin Positions Background
| 
About BTH
User Agreement
Privacy
Site Map
Contact
News Feeds
RSS Feed
Follow @Stephen Bucaro
General Web Design
