Get to know MDN better
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
* Some parts of this feature may have varying levels of support.
The list-item keyword causes the element to generate a ::marker pseudo-element with the content specified by its list-style properties (for example a bullet point) together with a principal box of the specified type for its own contents.
A single value of list-item will cause the element to behave like a list item. This can be used together with list-style-type and list-style-position.
list-item can also be combined with any <display-outside> keyword and the flow or flow-root <display-inside> keywords.
Note: In browsers that support the two-value syntax, if no inner value is specified it will default to flow. If no outer value is specified, the principal box will have an outer display type of block.
| CSS Display Module Level 3 # typedef-display-listitem |
Enable JavaScript to view this browser compatibility table.
This page was last modified on Apr 20, 2026 by MDN contributors.
Your blueprint for a better internet.
Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998–2026 by individual mozilla.org contributors. Content available under a Creative Commons license.