html - 如何使用 css 变换缩放 div 但不缩放内容？

Question

我正在尝试创建扩展 div 以显示更多图像的效果，但目前，图像随着 div 缩放而扩展。我目前像这样展开 div；

.panel:hover {
  transform: scaleX(1.5);
  z-index: 10;
}

我曾尝试将转换应用于父属性，例如列表和 anchor 标记，但没有成功。这是我的代码笔

http://codepen.io/duncanmolesworth/pen/LRdKYj

提前致谢

Answer 1

你正在做的是缩放面板，你想做的是增加它的宽度。

你可以试试这个:

.panel:hover {
   width: 150%;
   left: -25%;
   z-index: 10;
}