Working Bootstrap grid system across multiple devices

BootstrapWeb DevelopmentCSS Framework

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. Fewer 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.
  • Grid columns are created by specifying the number of twelve available columns you wish to span. For example, three equal columns would use three .col-xs-4.
raja
Published on 14-Jun-2018 06:46:47
Advertisements