The page layout determines where site components are placed, and controls how they will be displayed at different screen sizes.
Single Column
The mobile-first design principle begins with a single column stack of components. A page wrapper can add padding for mobile devices, with max width and centered on desktop.
body {
max-width: 64rem;
padding: 0 1rem;
margin: auto;
}https://codepen.io/mortona42/full/qBQJrvB
Wrapping and Overflow
Large elements, like tables and images can extend past the max width.
Level
Topics