A dozen classes and utilities give you freedom of action. You can create any structure you want without drastic changes in the code.
- Containers are must-haves. Use the traditional container class to create a layout with a responsive width or .container-fluid class to create a full-width structure on all devices regardless of dimension.
- Rows are must-haves. They are wrappers for all your experiments with column organization. The immediate children of rows are columns. Rows and columns are inseparable.
- You can change the column width depending on the screen size.
- Columns can be reordered. You can change their position depending on the device.
- Columns wrap and stack automatically.
- You can use less than 12 columns in a row. Conversely, you can have more than 12 columns in a row, and Bootstrap will deal with that on its own.
- Columns can be broken into rows and columns. Nesting is a common thing.
- Bootstrap 4 introduces auto-layout columns. Therefore, columns can “grow” and “shrink” on their own.
- Ems or rems define the sizes of columns, thereby making them flexible. Note, pxs define breakpoints.