Five equal columns in Bootstrap 3 (one row, one CSS property)

The solution with nested rows works good, but imho the issue can be solved more easily.

Bootstrap's classes for columns differ only by the width property. So we can just redefine this property for our purpose. It would be enough.

@media (min-width: 768px) {
  .ten-columns > .col-sm-2 {
    width: 20% !important;
  }
}

<div class="container-fluid">
  <div class="row ten-columns">
    <div class="col-sm-2">1</div>
    <div class="col-sm-2">2</div>
    <div class="col-sm-2">3</div>
    <div class="col-sm-2">4</div>
    <div class="col-sm-2">5</div>
  </div>
</div>

Check the result: http://codepen.io/glebkema/pen/LRWpBm