Skip to content

Instantly share code, notes, and snippets.

@Balamir
Created June 20, 2016 22:05
Show Gist options
  • Select an option

  • Save Balamir/465d45ecc5c5bbff84e466809de6b8cc to your computer and use it in GitHub Desktop.

Select an option

Save Balamir/465d45ecc5c5bbff84e466809de6b8cc to your computer and use it in GitHub Desktop.
Fix Bootstrap column issue
Since the columns are not all equal in height you need to add a clearfix <div> for the large viewports
just as the new row should start, that is between your 3rd and 4th column:
<div class="row">
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-6">...</div>
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-6">...</div>
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-6">...</div>
<!-- Add the extra clearfix for only the required viewport -->
<div class="clearfix visible-md visible-lg"></div>
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-6">...</div>
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-6">...</div>
<div class="col-lg-4 col-md-4 col-sm-6 col-xs-6">...</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment