`<content-position>` CSS type

The <content-position> enumerated value type is used by justify-content and align-content properties, and the place-content shorthand, to align the box's contents within itself.

Syntax

<content-position> = center | start | end | flex-start | flex-end

Values

The <content-position> enumerated value type is specified using one of the following key terms.

center

Centers the alignment subject within its alignment container.

start

Aligns the alignment subject flush with the alignment container's start edge.

end

Aligns the alignment subject flush with the alignment container's end edge.

flex-start

In flex layout, aligns the alignment subject flush with the edge of the alignment container corresponding to the flex container's main-start or cross-start side, as appropriate. It is identical to start for layout modes other than flex layout.

flex-end

In flex layout, aligns the alignment subject flush with the edge of the alignment container corresponding to the flex container's main-end or cross-end side, as appropriate. Identical to end for layout modes other than flex layout.

Specifications

See also

• Properties that use this data type: align-content, justify-content, place-content
• Other box alignment data types: <baseline-position>, <content-distribution>, content-position, <overflow-position>, and <self-position>
• CSS box alignment module
• CSS flexible box layout module
• CSS grid layout module