CSS list-style-position Property

CSS list-style-position property specifies the position of a list item marker in the principal block box.


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

Default value: outside
Applies to: List items
Inherited: Yes
Version: CSS1
JavaScript Syntax: object.style.listStylePosition = "inside"


Here is a syntax for the CSS list-style-position property

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

Property Values

The following table describes the values of this property.

Value Description
outside Default. Set the marker box is inside of the principal block box
inside Set the marker box is outside of the principal block box
initial Sets default value of this property
inherit Inherits this property from its parent element


The example below shows to sets list-style-position property.

.one {
  list-style-position: inside;
.two {
  list-style-position: outside;
.three {
  list-style-position: inside;
.four {
  list-style-position: outside;

Run it...   »

Browser Compatibility

  • Google Chrome 1+
  • Mozilla Firefox 1+
  • Internet Explorer 4+
  • Opera 3.5+
  • Safari 1+

Note: Here details of browser compatibility with version number may be this is bug and not supported. But recommended to always use latest Web browser.