Menu
I use the following CSS code for formatting when screen width is less than 480px, and it works well.
@media screen and (min-width: 480px) { body { background-color: lightgreen; } } I would like to get the current width for calculation to use zoom like it follows:
@media screen and (min-width: 480px) { body { background-color: lightgreen; zoom: (current screen width)/(480); } } 
241
Use the CSS3 Viewport-percentage feature.
Viewport-Percentage Explanation
Assuming you want the body width size to be a ratio of the browser's view port. I added a border so you can see the body resize as you change your browser width or height. I used a ratio of 90% of the view-port size.
<!DOCTYPE html> <html lang="en"> <head> <title>Styles</title> <style> @media screen and (min-width: 480px) { body { background-color: skyblue; width: 90vw; height: 90vh; border: groove black; } div#main { font-size: 3vw; } } </style> </head> <body> <div id="main"> Viewport-Percentage Test </div> </body> </html>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
