CSS list-style-position Property


Example

Specify that the the list-item markers should appear inside the content flow (results in an extra indentation):

ul {
    list-style-position: inside;
}

Try it yourself »

Definition and Usage

The list-style-position property specifies if the list-item markers should appear inside or outside the content flow.

Outside:

  • Coffee
  • Tea
  • Coca-cola

Inside:

  • Coffee
  • Tea
  • Coca-cola

Default value: outside
Inherited: yes
Animatable: no. Read about animatable
Version: CSS1
JavaScript syntax: object.style.listStylePosition="inside" Try it


Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property
list-style-position 1.0 4.0 1.0 1.0  3.5 


CSS Syntax

list-style-position: inside|outside|initial|inherit;

Property Values

Value Description Play it
inside Indents the marker and the text. The bullets appear inside the content flow Play it »
outside Keeps the marker to the left of the text. The bullets appears outside the content flow. This is default Play it »
initial Sets this property to its default value. Read about initial Play it »
inherit Inherits this property from its parent element. Read about inherit


Related Pages

CSS tutorial: CSS List

CSS reference: list-style property

HTML DOM reference: listStylePosition property



Color Picker

colorpicker