CSS `list-style-position` Property

Description

The list-style-position CSS property specifies the position of list-item marker with respect to the list item's principal block box.

The following table summarizes the usages context and the version history of this property.

Default value:	`outside`
Applies to:	List items
Inherited:	Yes
Animatable:	No. See animatable properties.
Version:	CSS 1, 2, 3

The syntax of the property is given with:

list-style-position:

inside | outside | initial | inherit

The example below shows the list-style-position property in action.

ol {
    list-style-position: inside;
}
ul {
    list-style-position: outside;
}

The following table describes the values of this property.

Value	Description
`inside`	The list marker is placed as the first inline box in the principal block box, before the element's content.
`outside`	The list marker is placed outside the principal block box. This is default.
`initial`	Sets this property to its default value.
`inherit`	If specified, the associated element takes the computed value of its parent element `list-style-position` property.

The list-style-position property is supported in all major modern browsers.