CSS Масштабирование элемента с шириной 100%

Я заинтересован в уменьшении div с шириной 100%. Проблема, с которой я столкнулся, заключается в том, что когда я масштабирую элемент, он получает фиксированную ширину и больше не расширяется на 100% ширины.

Пример -http://jsfiddle.net/Fz7qh/2/

Когда я использую CSS-свойство zoom (в отличие от transform: scale), оно работает как положено, но я слышал, что свойство zoom не очень хорошо поддерживается. Мой вопрос: это может быть достигнуто с помощью CSS transform scale?

 levi07 июн. 2012 г., 20:11
@thirtydot интересная идея. Кажется, работает. Опубликуйте это как ответ, чтобы я мог принять его
 thirtydot07 июн. 2012 г., 20:00
CSSzoom собственность действительно плохо поддерживается. Ни Firefox, ни Opera не поддерживают это.
 thirtydot07 июн. 2012 г., 20:06
Это то, что вы после?jsfiddle.net/thirtydot/Fz7qh/5

Ответы на вопрос(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%;
}​
 29 янв. 2016 г., 08:51
как насчет высоты?
 12 нояб. 2015 г., 09:14
Я, если бы мог дать это два голосов, я бы
 28 июн. 2015 г., 06:08
Я только добавилbox-sizing: border-box; также просто чтобы убедиться,padding также входит вwidth
 08 июн. 2012 г., 19:23
Интересно, почему некоторые люди принимают ответ, но не дают ему ответа ... Является ли ответ правильным, но недостаточно хорошим?
 29 мар. 2016 г., 19:44
Хорошо, я выяснил: вам нужно добавить внешний элемент и масштабировать его в зависимости от масштаба, как здесьjsfiddle.net/v2fukeq5/11 (+ переполнение для неконстантной высоты).

Ваш ответ на вопрос