2

Im trying to zoom out my application through css by using 

zoom: 90% !important

It works in IE, Chrome and Safari. But it is not working in Firefox. For Firefox im using :

-moz-transform: scale(0.9);

But it does not seem to work. Can you please help me to achieve zoom out feature in Firefox

Ivan
  • 34,531
  • 8
  • 55
  • 100
NoRegrets
  • 31
  • 1
  • 3

1 Answers1

2

This question seems to have been already answered here, here and here.

The zoom property is not supported in Firefox and Opera : see ref

You can use -moz-transform: scale(0.9) but you will not get the same result:

body {
    zoom: 0.9;
    -moz-transform: scale(0.9);
    -moz-transform-origin: 0 0;
    -o-transform: scale(0.9);
    -o-transform-origin: 0 0;
    -webkit-transform: scale(0.9);
    -webkit-transform-origin: 0 0;
    transform: scale(0.9);
    transform-origin: 0 0;
}
Community
  • 1
  • 1
Ivan
  • 34,531
  • 8
  • 55
  • 100
  • 1
    Thanks Evan. I tried it, but it doesn't change the size. Only firefox does not respond to the style specifications. Other browsers it seems to work fine. – NoRegrets Aug 08 '16 at 09:04
  • Weird, it works for me. Have you tried opening the inspector in Moz and applying those properties to the body tag ? – Ivan Aug 08 '16 at 09:05
  • Usefull links: Css Reference https://developer.mozilla.org/en-US/docs/Web/CSS/Reference Can I use http://caniuse.com/# – CMartins Aug 08 '16 at 10:13
  • It does zoom out the body, but leaves space at the right and bottom as we have given -moz-transform-origin: 0 0; When we manually click on - option and zoom out browser the UI look and feel we get, I'm not to achieve with -moz-transform:scale(0.9) – NoRegrets Aug 11 '16 at 08:38
  • I understand what you're saying, I will edit my answer – Ivan Aug 11 '16 at 13:27