Create responsive website with Bootstrap

Bootstrap Grid

The Bootstrap Grid System allows up to 12 columns across the page. You can use all 12 columns individually or you can groups the columns together to create wider columns.

Grid Classes

The Bootstrap grid system has four classes:

• xs (for phones)
• sm (for tablets)
• md (for desktops)
• lg (for larger desktops)

Structure of a Bootstrap Grid

Follow the below instructions while creating a Bootstrap Grid:

• Create a row (<div class="row">).
• Add the number of columns, you want in the grid (tags with appropriate .col-*-* classes).
• Note that numbers in .col-*-* should always add up to 12 for each row.

Grid Example

For equal columns :

For unequal columns :