Grid system

Grid systems are used for creating page layouts through a series of rows and columns that house your content.

Examples

Stacked-to-horizontal

Using a single set of .col-md-* grid classes, you can create a basic grid system that starts out stacked on mobile devices and tablet devices (the extra small to small range) before becoming horizontal on desktop (medium) devices. Place grid columns in any .row.

col-lg-12
col-lg-6
col-lg-6
col-lg-4
col-lg-4
col-lg-4
col-lg-3
col-lg-3
col-lg-3
col-lg-3
col-lg-2
col-lg-2
col-lg-2
col-lg-2
col-lg-2
col-lg-2

Mobile, tablet, and desktop

Don't want your columns to simply stack in smaller devices? Use the extra small and medium device grid classes by adding .col-xs-* .col-md-* to your columns. See the example below for a better idea of how it all works.

col-xs-6
col-xs-6
col-lg-8
col-sm-6
col-sm-6
col-lg-6
col-md-6
col-md-6
col-lg-4
col-sm-6
col-sm-6
Chat with Ann Laurens
  • Yes, it is indeed very beautiful. 10:03 pm
  • Did you see the changes? 10:02 pm
  • I just arrived at work, it was quite busy. 06:44pm
    I will take look in a minute. 06:45pm
  • The colors are much better now.
    The colors are brighter than before. I have already sent an example. This will make it look sharper. Mon
  • Are the colors of the logo already adapted? Last week