All elements with a default or assigned display
property value of 'list-item'
Inherit From Parent:
Yes
Applicable Media:
Visual
HTML Equivalent:
NA
What is it?
This property determines how the list-marker is rendered in relation to the
content of the list item.
Allowed Values
inherit
[CSS2] [N6|O4]
Type: Explicit
Description:
Explicitly sets the value of this property to that of the parent.
outside
[CSS1|CSS2]
[IE4B2|N6|O3.5]
Type: Explicit
Description:
This specifies that all list item content will be rendered indented from the
list-marker.
inside
[CSS1|CSS2]
[IE4B2|N6|O3.5]
Type: Explicit
Description:
This renders wrapped content at a similar indentation level to the list-marker.
Example
Ext/Doc: ul {
list-style-position: inside }
In-Line: <ul><liSTYLE="list-style-position:
inside">test text in the list
item</li></ul>
Browser Peculiarities
Internet Explorer
4.0:
- Applying to individual List Items (LI) has no effect. Must be
applied to list structure itself.
4.0+:
- Does not apply to elements with assigned 'display' property of "list-item"
and does not apply to DL/DT/DD.
5.0:
- Applying to individual List Items (LI) indents the list item as well
as applying the property.
6.0:
- Beginning in this version, there only seems to be enough space
allocated to the list marker when list-style-position is set to "inside"
for one digit plus its accompanying "." suffix character (even that
is questionable, depending on the font I suppose.) If there are more
characters than this (say, if the numbering starts or goes beyond
10 or more), then the list marker starts to overlap the list item content.
Opera
3.5:
- Does not apply to elements with assigned 'display' property of "list-item"
and does not apply to DL/DT/DD.
- Applied to OL/UL, entire list is indented along with style applied to LI.