'Scale down entire bootstrap page

When I zoom down to 80% percent in chrome my bootstrap page looks good.

Is there a way to modify the css to scale down the entire site?

csstwitter-bootstrap-3


Solution 1:[1]

I don't think that is good practice, but you could try:

body {
  transform: scale(0.8); /* 80% */
}

Solution 2:[2]

I came across this as I had had the exact same thought as the OP. The problem with the transform: scale answer is that it completely breaks the layout I'm using.

This barely seems worth posting as an answer, but in my case, I found the majority of style changes from zooming out were from the font itself shrinking.

Using <body style="font-size: small;"> was quite literally all I needed to replicate that ~80% zoom look.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Ron van der Heijden
Solution 2 Peter

Related Questions