CSS缩放100％宽度的元素

Question

我有兴趣缩小100％宽度的div。我遇到的问题是，当我缩小元素时，它会获得固定的宽度，不再延伸100％的宽度。

示例 - http://jsfiddle.net/Fz7qh/2/

当我使用CSS缩放属性（而不是变换：缩放）时，它按预期工作，但我听说缩放属性不受支持。我的问题是用CSS变换量表可以实现吗？

Answer 1

要模拟zoom属性在这种情况下执行的操作，您可以添加-transform-origin: 0 0;并将width设置为oldWidth / newScale（100 / 0.7 ~= 142.857143）：

http://jsfiddle.net/thirtydot/Fz7qh/5/

div.zoomed {
    -webkit-transform: scale(.7);
    -webkit-transform-origin: 0 0;
    width: 142.857143%;
}​