Columns
- Bootstrap columns come in 12 sizes.
- A column width is set by giving it a number between 1 and 12.
- A col-1 is one 12th of the width of its container.
- A col-6 is six 12ths (one half) of the width of its container.
- A col-12 is twelve 12ths and so full width of its container.
- As you can see, having 12 different size choices gives you a multitude of different ways to arrange your columns on the screen.
col-1
col-2
col-3
col-4
col-5
col-6
col-7
col-8
col-9
col-10
col-11
col-12
Displaying columns together
Columns will display next to each other, until their total width adds up to 12.
col-9
col-3
col-2
col-8
col-2
col-4
col-4
col-4
col-3
col-6
col-3
col-6
col-4
col-2
col-1
col-11