How to adjust CSS for specific zoom level?
In this article, we are going to learn how do we adjust the CSS for a specific zoom level. The CSS zoom property allows scaling of the content. This property is not recommended for production sites because it doesn’t support in some browsers.
- percentage: Scaling by percentage
- number: Scaling using percentage, e.g 1 = 100% and 1.5 = 150%
- normal: zoom: 1
Syntax: (The zoom here is set at 100%. Change it accordingly.)
<button onclick="sampleDiv.style.zoom='100%'">Zoom 100%</button>
Example: This example shows how to adjust CSS for specific zoom level.
- Google Chrome
- Internet Explorer
- Apple Safari