::column

The ::column CSS pseudo-element represents the different column fragments of a container set to display in multiple columns via CSS multi-column layout.

Syntax

css
::column {
  /* ... */
}

Description

When CSS multi-column layout is used to lay out a container's content in multiple columns (for example, using the column-count property), a box is generated to contain each generated column's content. The ::column pseudo-element represents those generated boxes.

This is useful for CSS carousels — ::column can be used to generate ::scroll-marker pseudo-elements for each column, and set them as snap targets using CSS scroll snap.

Beyond that, the styling that can be applied to ::column is very limited, but may be expanded in the future.

Examples

See Creating CSS carousels for full examples that use the ::column pseudo-element.

Specifications

No specification found

No specification data found for css.selectors.column.
Check for problems with this page or contribute a missing spec_url to mdn/browser-compat-data. Also make sure the specification is included in w3c/browser-specs.

Browser compatibility

See also