It’s a easy way to make if you follow the bootstrap structure and use this code.
Here is the example of 5 columns.
HTML :
<div class="row"> <div class="col-md-5ths col-xs-6"> <span>This is column 1</span> </div> <div class="col-md-5ths col-xs-6"> <span>This is column 2</span> </div> <div class="col-md-5ths col-xs-6"> <span>This is column 3</span> </div> <div class="col-md-5ths col-xs-6"> <span>This is column 4</span> </div> <div class="col-md-5ths col-xs-6"> <span>This is column 5</span> </div> </div>
CSS:
.col-xs-5ths, .col-sm-5ths, .col-md-5ths, .col-lg-5ths { position: relative; min-height: 1px; padding-right: 10px; padding-left: 10px; } .col-xs-5ths { width: 20%; float: left; } @media (min-width: 768px) { .col-sm-5ths { width: 20%; float: left; } } @media (min-width: 992px) { .col-md-5ths { width: 20%; float: left; } } @media (min-width: 1200px) { .col-lg-5ths { width: 20%; float: left; } }