Альтернативное решение для CSS zoom

Question

Я использую CSS zoom, чтобы сжать предварительный просмотр большого div.

<div id="layoutEditCanvas" style="width:1920px;height:1080px;background:url('{{layout.backgroundImage}}')"> 
</div> 

zoom набор так:

zoom:0.5; 

Теперь FF не поддерживает zoom поэтому я должен использовать

-moz-transform: scale(0.5); 
-moz-transform-origin: 0 0; 

Моя проблема заключается в том, что в то время как Chrome занимает CSS zoom и сжимает мой div до 960 x 540, FF оставляет div с его первоначальным размером и только масштабирует его содержимое, оставляя меня с огромным пустое пространство вокруг содержимого усадки.

Есть ли параметр, чтобы иметь (масштабное) преобразование, чтобы вести себя как zoom?

Answer 1

Я обнаружил, что можно избежать этого эффекта, установив фиксированную высоту/ширину и переполнение: скрытый элемент, который обертывает элемент «scale scale», таким образом скрывая это переполнение, созданное масштабированием.

Answer 2

Можете ли вы обернуть все в другой div и установить масштаб на .5 на этой обертке?