list-style-position (CSS property)
Example
This style rule makes the markers for
all items within the list with ID "compact" appear on
the inside:
#compact li {
list-style-position: inside;
}
Description
This property specifies where the list marker is rendered with respect to the list item’s principal block box.
Value
outside- The value
outsidecauses the list marker to be rendered outside the principal block box. Its precise location isn’t defined by the CSS2.1 specification. Contemporary browsers seem to render it approximately 1.5em to the left of the principal block box in a left-to-right environment, or 1.5em to the right of the principal block box in a right-to-left environment. Some browsers use padding on the list to make room for the marker box, while others use a margin. inside- The value
insidemakes the list marker the first inline box in the principal block box. Its exact location is not defined by the CSS2.1 specification.
Compatibility
| IE | 5.5 | Full |
|---|---|---|
| 6.0 | Full | |
| 7.0 | Full | |
| Firefox | 1.0 | Full |
| 1.5 | Full | |
| 2.0 | Full | |
| Safari | 1.3 | Full |
| 2.0 | Full | |
| 3.0 | Full | |
| Opera | 9.2 | Full |
| 9.5 | Full |
Internet Explorer for Windows versions up to and
including 7 don’t support the value inherit.
User-contributed notes
There are no comments yet.
Add a note
To post a note on this topic, please log in with your SitePoint username and password. If you don't have an account yet, you can create a new account for free.

