CSS Scale an element with 100% width

Question

I am interested in zooming out a div with 100% width. The problem I am having, is when I scale the element out it gets a fixed width and no longer extends 100% of the width.

Answer 1

To emulate what the zoom property does in this case, you can add -transform-origin: 0 0; and set the width to 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%;
}​