align-self

The align-self property overrides the align-items value for an individual flex item.

Formal Syntax

Initial value: auto
Applies to: flex items, grid items, and absolutely-positioned boxes
Inherited: no
Percentages: n/a
Computed value: specified keyword(s)
Animation type: discrete

See specification

JavaScript Access

// Access via element.style element.style.alignSelf = "auto";

Browser Support

standard | MDN · Spec · Spec

Feature	Chrome	Firefox	Safari	Edge
align-self	29	20	9	12
anchor-center	125	147	26	125
auto	21	28	7	79
flex_context	36	20	7	12
grid_context	57	52	10.1	16
normal	21	28	7	79
position_absolute_context	122	134	—	122
stretch	21	28	7	79

Related Properties

align-content
align-items
anchor-name
anchor-scope
break-after
break-before
break-inside
caption-side
clear
column-count
column-fill
column-gap
column-rule
column-rule-color
column-rule-style
column-rule-width
column-span
column-width
columns
contain
container
container-name
container-type
content
content-visibility
display
empty-cells
flex
flex-basis
flex-direction
flex-flow
flex-grow
flex-shrink
flex-wrap
float
gap
grid
grid-area
grid-auto-columns
grid-auto-flow
grid-auto-rows
grid-column
grid-column-end
grid-column-start
grid-row
grid-row-end
grid-row-start
grid-template
grid-template-areas
grid-template-columns
grid-template-rows
justify-content
justify-items
justify-self
order
overflow
overflow-anchor
overflow-block
overflow-inline
overflow-wrap
overflow-x
overflow-y
place-content
place-items
place-self
position-anchor
position-area
position-try
position-try-fallbacks
position-try-order
position-visibility
resize
row-gap
table-layout
text-overflow
visibility
z-index
reading-flow 🧪
reading-order 🧪
align-tracks 🚧
block-ellipsis 🚧
block-step 🚧
block-step-align 🚧
block-step-insert 🚧
block-step-round 🚧
block-step-size 🚧
bookmark-label 🚧
bookmark-level 🚧
bookmark-state 🚧
column-height 🚧
column-rule-break 🚧
column-rule-outset 🚧
column-wrap 🚧
continue 🚧
float-defer 🚧
float-offset 🚧
float-reference 🚧
flow-from 🚧
flow-into 🚧
grid-column-gap 🚧
grid-gap 🚧
grid-row-gap 🚧
inline-sizing 🚧
item-cross 🚧
item-direction 🚧
item-flow 🚧
item-pack 🚧
item-tolerance 🚧
item-track 🚧
item-wrap 🚧
justify-tracks 🚧
region-fragment 🚧
row-rule 🚧
row-rule-break 🚧
row-rule-color 🚧
row-rule-outset 🚧
row-rule-style 🚧
row-rule-width 🚧
rule 🚧
rule-break 🚧
rule-color 🚧
rule-outset 🚧
rule-overlap 🚧
rule-style 🚧
rule-width 🚧
wrap-after 🚧
wrap-before 🚧
wrap-flow 🚧
wrap-inside 🚧
wrap-through 🚧
page-break-after 🗑️
page-break-before 🗑️
page-break-inside 🗑️