Which CSS3 layout module provides a modern, one-dimensional layout model with flex containers and items?

Which CSS3 layout module provides a modern, one-dimensional layout model with flex containers and items?

• A. Table Layout
• B. CSS Grid
• C. Multi-Column Layout
• D. Flexbox

Answer: (D)

Flexbox focuses on one-dimensional layouts, placing and sizing items along a single axis inside a container that uses display: flex. This makes it ideal for creating flexible navigation bars, toolbars, or any row or column of elements that must adapt as space changes. The core idea is that you control direction with flex-direction, distribute space with justify-content, align items with align-items (and align-content for multiple lines), and optionally wrap items with flex-wrap. This module is specifically designed for one-dimensional layouts, unlike CSS Grid, which handles two-dimensional arrangements with both rows and columns. Other options differ in purpose: Table Layout relies on table rendering, and Multi-Column Layout creates newspaper-like text columns rather than controlling individual item placement.

Flexbox focuses on one-dimensional layouts, placing and sizing items along a single axis inside a container that uses display: flex. This makes it ideal for creating flexible navigation bars, toolbars, or any row or column of elements that must adapt as space changes. The core idea is that you control direction with flex-direction, distribute space with justify-content, align items with align-items (and align-content for multiple lines), and optionally wrap items with flex-wrap. This module is specifically designed for one-dimensional layouts, unlike CSS Grid, which handles two-dimensional arrangements with both rows and columns. Other options differ in purpose: Table Layout relies on table rendering, and Multi-Column Layout creates newspaper-like text columns rather than controlling individual item placement.