Advertisement

← All Cheat Sheets

CSS Flexbox Cheat Sheet

Most used Flexbox properties for layout

Container

display: flexEnable flexbox context

flex-direction: row | columnMain axis direction

flex-wrap: wrapAllow wrap

justify-content: centerMain axis alignment

align-items: centerCross axis alignment

Item

order: 2Display order

flex-grow: 1Item grows relative

flex-shrink: 1Item can shrink

align-self: flex-endOverride alignment

Advertisement