CSS list-style-position Property
CSS list-style-position property specifies the position of a list item marker in the principal block box.
Usages
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" |
Syntax
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 |
Examples
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;
}
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.