title: center a floating div css cascade
body: <p>I have started making a grid and each row has a class ".row" and inside that are classes with .col-3-12 for the width of the div and they float left what I want to do is create a class called .centred and have that inner div that is floated centred. At the moment it centre's the div at 50% it need's a -50% somewhere to make it in the middle <a href="http://codepen.io/anon/pen/iFrdl" rel="nofollow">codepen</a></p>
  
  <pre><code> &lt;div class="row"&gt;
  
      &lt;div class="col-3-12 centered"&gt;
          Duis aute irure dolor in reprehenderit in voluptate velit esse
          cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
      &lt;/div&gt;  
  
  &lt;/div&gt;
  
   .row [class*="col-"].centred {
        left: 50%;     
   }
   .col-3-12 {
      width: 23.5%;
   }
  </code></pre>