Grid And Flexbox

Align Self

Style syntax for controlling how an individual item is aligned along its cross axis.

🚧This page is still under construction and some content may not be complete.

Overview [sr-only]

ClassDeclarations
align-self:value / as:valuealign-self: value
align-self:autoalign-self: auto
align-self:normalalign-self: normal
align-self:baselinealign-self: baseline
align-self:centeralign-self: center
align-self:stretchalign-self: stretch
align-self:startalign-self: start
align-self:endalign-self: end
align-self:flex-startalign-self: flex-start
align-self:flex-endalign-self: flex-end
align-self:self-startalign-self: self-start
align-self:self-endalign-self: self-end

Conditionally apply

Apply styles in different states using selectors, media queries, etc.

<div class="align-self:auto:hover align-self:auto@sm align-self:auto@dark align-self:auto@print"></div>
PREVIOUS
Align Items

Style syntax for controlling how items are aligned along its cross axis.

NEXT
Gap

Style syntax for setting the gutters between rows and columns.

MIT License © Aoyue Design LLC.