Scale the whole website by 0.8 when in a certain width

Question

I am working on a responsive website and the elements on the website are larger than I anticipate. I would like to zoom out or scale back the website such that if the website is loaded in a device of certain width, it would show the scaled down version. I know it can be done using the media queries but I would like to do something less painful and just scale the website down to 0.8. Similar to zooming out to 80% in chrome browser.

The same here but without @media http://stackoverflow.com/questions/17333254/scale-the-contents-of-a-div-by-a-percentage — Lucas Steffen, Mar 14 '17 at 21:03

score 4 · Accepted Answer · answered Mar 14 '17 at 20:54

4

You could do:

@media (max-width: 800px) {
    body: {
        zoom: .8;
    }
}

answered Mar 14 '17 at 20:54

dave

62,300
5
72
93

This is exactly what OP defined as "painful", I wonder what can possibly be easier than this. – Lucas Steffen Mar 14 '17 at 20:59
@LucasSteffen If OP is a masochist then there should be another way. If he isn't then this is the best way. – dokgu Mar 14 '17 at 21:01
Exactly what I needed! Thanks!! – Sunil Jamkatel Mar 15 '17 at 05:17

Scale the whole website by 0.8 when in a certain width

1 Answers1