What is Flexbox?
A one-dimensional CSS layout model that distributes space and aligns items along a row or column axis.
Definition
Flexbox (display: flex) arranges children along a main axis with automatic space distribution via justify-content, cross-axis alignment via align-items, and proportional sizing through flex-grow, flex-shrink, and flex-basis. It solved problems that plagued float-based layouts for a decade: vertical centering, equal-height columns, and reordering without touching markup. The gap property, borrowed from Grid, replaced margin hacks between items. Flexbox excels at component-level layout—navbars, button groups, media objects—while CSS Grid is the better tool when both rows and columns need coordination.

