Flexbox (Flexible Box Layout) is a CSS layout model for distributing space among items in a container. It handles alignment, direction, ordering, and sizing of elements in one dimension (row or column).

What is the difference between justify-content and align-items?

justify-content aligns items along the main axis (horizontal for row, vertical for column). align-items aligns items along the cross axis (perpendicular to main axis).

What does flex: 1 1 auto mean?

flex-grow: 1 (item can grow), flex-shrink: 1 (item can shrink), flex-basis: auto (initial size based on content). This lets the item grow and shrink proportionally.