title: Create custom col sizes in bootstrap
body: <p>I'm taking advantage of the xs sm md lg columns in order to define how large the columns should be at different screen sizes. It is working fine but I would like to have more fine tuned control and define my own custom sizes.</p>
  
  <p>For instance I'd like to have a col size that exists between xs and sm.</p>
  
  <p>I added a col-ss class like so:</p>
  
  <pre><code>@media (min-width: 600px)
  .col-ss-4 {
    width: 33.33333333333333%;
  }
  @media (min-width: 600px)
  .col-ss-1, .col-ss-2, .col-ss-3, .col-ss-4, .col-ss-5, .col-ss-6, .col-ss-7, .col-ss-8, .col-ss-9, .col-ss-10, .col-ss-11, .col-ss-12 {
    float: left;
  }
  </code></pre>
  
  <p>And added the class like so:</p>
  
  <pre><code>&lt;div class="col-sm-5 col-ss-4"&gt;Content Here&lt;/div&gt;
  </code></pre>
  
  <p>But it seems to have no effect.</p>