A CSS layout model for one-dimensional arrangements (row or column). Flexbox distributes space among items and handles alignment, even when sizes are dynamic. Set display: flex on the container and control children with properties like justify-content, align-items, and flex-grow.

A CSS layout model for two-dimensional layouts with rows and columns. Grid gives precise control over placement and sizing of elements. More powerful than Flexbox for complex page layouts.

A CSS feature that applies styles conditionally based on the device's characteristics (width, height, orientation, color scheme). Media queries are the foundation of responsive design.