CSS悬停效果在列中的图像上被切断（仅限Chrome）

我已经把我论坛上的内容分为三个栏目，并在每个帖子的图片上附加了一个悬停效果。此悬停效果用于放大图像，CSS为：

.MessageList .Message img:hover {
-webkit-transform:scale(1.2);
-moz-transform:scale(1.2);
-ms-transform:scale(1.2);
-o-transform:scale(1.2);
transform:scale(1.2);
position: relative;
z-index: 1;
}

我的测试网站是：

我创建了一个JSFIDLE来解释我的问题：

如果在Chrome中打开JSFIDLE-悬停效果将被切断

如果在Firefox中打开JSFIDLE，悬停效果会非常好

---

有人知道为什么这种效果在一个浏览器中有效而在另一个浏览器中无效吗

我相信这是一个webkit错误。除了切换到使用其他工具（flexbox？），您对此无能为力

可能与前面提到的bug有关或相同

水平溢出列的文本将被截断