You are here: Reference > CSS > properties > list-style-position

list-style-position property

Browser support:
Specifies whether the list marker for a list item should appear inside or outside the list-item box.
JavaScript page for this property: listStylePosition. You can find other example(s) there.

Possible values:

 One of the following values: 
inherit
Takes the value of this property from the computed style of the parent element.
inside
List-marker is inside the text, and wrapped text content will be rendered at an indentation level similar to the marker.
outside
Default. The list-marker will be rendered before any text content.
Default: outside.

Example HTML code 1:

This example illustrates the use of the list-style-position property:
<body>
    <ol style="list-style-position: inside;">
        <li>inside
        <li>list
        <li>position
    </ol>

    <ol style="list-style-position: outside;">
        <li>outside
        <li>list
        <li>position
    </ol>
</body>
Did you find this example helpful? yes no

Supported by tags:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content