Skip to main content

Grid

Grid system​

Use this powerful mobile-first flexbox grid to build layouts of all shapes and sizes thanks to a twelve column system.

Grid​

col-12 col-sm-5 col-md-2 col-lg-6
col-12 col-sm-7 col-md-10 col-lg-4
col-4 col-md-1
col-4 col-md-1
col-4 col-md-1
col-4 col-md-1
col-4 col-md-1
col-4 col-md-1
col-4 col-md-1
col-4 col-md-1
col-4 col-md-1
col-4 col-md-1
col-4 col-md-1
col-4 col-md-1
col-2
col-2
col-2
col-2
col-2
col-2
col-3
col-3
col-3
col-3
col-4
col-4
col-4
col-6
col-6
col-12 
<div class="container">
 <div class="row">
   <div class="col-12 col-sm-8 col-md-6 col-lg-1">col-1</div>
   <div class="col-1">col-1</div>
   <div class="col-1">col-1</div>
   <div class="col-1">col-1</div>
   <div class="col-1">col-1</div>
   <div class="col-1">col-1</div>
   <div class="col-1">col-1</div>
   <div class="col-1">col-1</div>
   <div class="col-1">col-1</div>
   <div class="col-1">col-1</div>
   <div class="col-1">col-1</div>
   <div class="col-1">col-1</div>
 </div>
</div>