Boostrap Grid System

  • Rows: Groups Columns
  • Columns: Seperate content
  • Containers: Used to create grid
  • Learn More: getbootstrap.com/grid

Simple Grid System!

An example grid:

<div class="container">
  <div class="row">
    <div class="col-md-4 col-lg-6">Your Column1 Content</div>
    <div class="col-md-4 col-lg-6">Your Column1 Content</div>
  </div>
</div>

.col-12

.col-6

.col-6

.col-4

.col-4

.col-4

.col-3

.col-3

.col-3

.col-3

.col-2

.col-2

.col-2

.col-2

.col-2

.col-2

.col-8

.col-4

.col-3

.col-3

.col-6

.col-4

.col-2

.col-2

.col-4

Right Sidebar Content

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce volutpat ac tortor eu viverra. Etiam ipsum neque, fermentum quis sagittis nec, hendrerit id diam. Mauris a tincidunt odio. Sed porttitor ex pulvinar, tristique sapien sed, malesuada nunc.

Navbar Themes