Bootstrap Grids


Grid structure content and helps in designing it perfectly. Grid systems are used for creating page layouts through a series of rows and columns that house your content.

Here's how the Bootstrap grid system works −

  • Rows must be placed within a .container class for proper alignment and padding.
  • Use rows to create horizontal groups of columns.
  • Content should be placed within the columns, and only columns may be the immediate children of rows.
  • Predefined grid classes like .row and .col-xs-4 are available for quickly making grid layouts. LESS mixins can also be used for more semantic layouts.
  • Columns create gutters (gaps between column content) via padding. That padding is offset in rows for the first and the last column via negative margin on .rows.

Updated on: 12-Jun-2020

97 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements