列元素上的 CSS 3 动画“变换：缩放”在 Chrome 上不起作用

我在 Chrome v44 中遇到问题，我尝试使用“transform:scale(1.1)”放大列项中的图像，但动画不起作用……如果我尝试在 Firefox 上使用，效果很好！我认为问题是由于 chrome 造成的，但我想知道是否有人找到了解决方法。

    .column-wrap {
      columns: 3;
    }

    .column-item {
      background-color: red;
    }

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

    .column-img {
      display: block;
      max-width: 100%;
      height: auto;
      transform: scale(1);
      transition: transform .3s ease;
    }

    .column-img:hover {
      transform: scale(1.1);
      transition: transform .3s ease;
    }

这是一个演示：http://codepen.io/anon/pen/YyKgyW

thanks

EDIT：我找到了一个解决方法：-webkit-backface-visibility：隐藏；我在图像包装类“.column-img-wrap”和图像类“.column-img”上添加此属性，它工作得很好！

我找到了一个解决方法：-webkit-backface-visibility：隐藏；我在图像包装类“.column-img-wrap”和图像类“.column-img”上添加此属性，它工作得很好！

.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