place-self

The place-self CSS shorthand property allows you to align an individual item in both the block and inline directions at once (i.e., the align-self and justify-self properties). This property applies to block-level boxes, absolutely-positioned boxes, and grid items. If the second value is not present, the first value is also used for it.

Values: This property is specified as one or two of the following keyword values:

Values: auto Computes to the parent’s align-items value. normal The effect of this keyword is dependent of the layout mode we are in: In absolutely-positioned layouts, the keyword behaves like start on replaced absolutely-positioned boxes, and as stretch on all other absolutely-positioned boxes. In static position of absolutely-positioned layouts, the keyword behaves as stretch. For flex items, the keyword behaves as stretch. For grid items, this keyword leads to a behavior similar to the one of stretch, except for boxes with an aspect ratio or an intrinsic size where it behaves like start. The property doesn’t apply to block-level boxes, and to table cells.

Syntax example: place-self: auto center;