Is there a way to stop Internet Explorer 11 from automatically zooming to fit the viewport width?
I need the browser to respect my max-width rule and not scale the content to fill the entire width of the viewport on its own.
This issue is happening in IE11 on Surface Pro 2, both in "desktop" and "metro" modes. The problem is mentioned here and could be linked to external displays. However, I am experiencing it regardless of external display connection, with zooming occurring on both the Surface monitor and external displays.
The Microsoft documentation page suggests using this CSS rule to opt-out of automatic scaling:
@media screen {
@-ms-viewport {
width: device-width;
}
}
Unfortunately, this solution does not work for me as it only hides the vertical scrollbar by default. The pages still zoom to fill the full width of the viewport, disregarding any max-width values set in the CSS.
The documentation states:
By default, Internet Explorer in the new Windows UI scales content automatically when the window is narrower than 1024 pixels. This includes snapped state and portrait mode primarily.
In cases where automatic scaling is not desired, the device-width keyword can be used. It indicates that the page is designed to work well regardless of the device's width.
However, my experience contradicts this information. Content is automatically scaled when the viewport is wider than 1024 pixels.
--
Here is how my meta viewport tag is currently set:
<meta name="viewport" content="width=device-width,initial-scale=1">