CSS 3 animation “transform: scale” on column element doesn't work on chrome

Question

I encounter an issue in Chrome v44, I tried to zoom in on the image in item of column with a \"transform: scale(1.1)\", the animation doesn\'t work… And if I try on firefox

Answer 1

I found a workaround: -webkit-backface-visibility: hidden; I add this property on image wrapper class ".column-img-wrap" and the image class ".column-img" and it works perfectly !

.column-img-wrap {
  margin: 0;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
}

.column-img {
  display: block;
  max-width: 100%;
  transform: scale(1);
  transition: transform .3s ease;
  -webkit-backface-visibility: hidden;
}

demo: http://codepen.io/nielk/pen/gaOaVz