title: Buggy CSS animate (transition) a element inside a column?
body: <p>Is there any known issue when making a CSS transition to elements inside columns? </p>
  
  <p>I've problems in webkit (Safari and Chrome), didn't test others...</p>
  
  <p>I've made <a href="http://cdpn.io/KrJcL" rel="nofollow">a simple demo</a> where a transition is applied (on hover) to a image that sits inside columns. The problem happens on all columns except the first, it won't render the applied filter or the transition. </p>
  
  <p>The first column works as expected, and if I remove the columns also render ok.</p>
  
  <p>This is a relevant part of the CSS:</p>
  
  <pre><code>#photos img {
    width:              100% !important;
    height:             auto !important;
    opacity:            1;
    -webkit-filter:     blur(0);
    -webkit-transition: all 200ms ease-in;
  }
  
  #photos div:hover img {
    opacity:            0.25;
    -webkit-filter:     blur(2px);
    -webkit-transition: all 200ms ease-in;
  }
  </code></pre>