<display-listitem>

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.

Syntax

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.

Examples

HTML

<div class="fake-list">I will display as a list item</div>

CSS

.fake-list {
  display: list-item;
  list-style-position: inside;
}

Result

Specifications

Browser compatibility

Support of list-item

See also

• display
  • <display-outside>
  • <display-inside>
  • <display-internal>
  • <display-box>
  • <display-legacy>