HTML

<div class="container-fluid">
 <div class="row">
 
  <div class="col-md-3">
   <p class="demo-content demo-content-1">content</p>
  </div>

  <div class="col-md-3">
   <p class="demo-content demo-content-2">content</p>
  </div>

  <div class="col-md-3">
   <p class="demo-content demo-content-3">content</p>
  </div>

  <div class="col-md-3">
   <p class="demo-content demo-content-4">content</p>
  </div>
 
 </div>
</div>

CSS

.demo-content {
  color: #FFFFFF;
  padding: 2.9rem 2rem;
  text-align: center;
}

.demo-content-1 {
  background-color: #537C78;
}

.demo-content-2 {
  background-color: #7BA591;
}

.demo-content-3 {
  background-color: #CC222B;
}

.demo-content-4 {
  background-color: #F15B4C;
}

Responsive Columns

md-6 + md-6 md-3 + md-9 md-9 + md-3 md-4 + md-8 md-8 + md-4 4 x md-3 2 x md-3 (space between) 2 x md-3 (centered) 2 x md-4 (space between) 2 x md-4 (centered) 3 x md-4 6 x md-2

Basics

Create a Basic Bootstap Page Include CSS, JS and Font Awesome

OTHER BOOTSTRAP SNIPPETS