High DPI support
Internet Explorer 11 brings enhanced scaling for high DPI screens and small slates, ensuring the consistency of your website’s text, touch targets, and layout across Windows 8.1 devices. Specifically, IE11 introduces the following high DPI improvements.
Important With the exception of the devicePixelRatio property, the features listed here are not supported in IE11 on Windows 7.
Support for the devicePixelRatio property
Although device resolution has been available since Microsoft Internet Explorer 6 with the deviceXDPI and deviceYDPI properties (and also via Media Queries resolution starting in Windows Internet Explorer 9), the devicePixelRatio property has quickly become a de-facto standard used across the web. IE11 adds support for this property, which represents the ratio between physical device pixels and DPI-adjusted logical CSS pixels. With previous versions of IE, you had to perform the following equation to get this same value:
window.devicePixelRatio = window.screen.deviceXDPI / window.screen.logicalXDPI
Improved scale factor selection
IE11 has improved logic for determining the most optimal scale factor, incorporating viewing distance considerations, a wider selection of default scale factors, and a number of other variables.
With IE11, both Internet Explorer in the new Windows UI and Internet Explorer for the desktop have identical support across a much wider range of default scaling factors. OEMs and Windows 8.1 consumers get more flexibility for consistently optimal viewing of your website across device form factors and screen resolutions.
| Zoom level settings | 100% | 125% | 150% | 175% | 200% | 250% | 300% |
|---|---|---|---|---|---|---|---|
| IE10 | X | X | X | X | X | ||
| IE10 for the desktop | X | X | X | ||||
| IE11 | X | X | X | X | X | X | X |
| IE11 for the desktop | X | X | X | X | X | X | X |
Multiple monitor support
Because Windows 8 uses a single DPI setting, if you're using multiple monitors with different DPIs, you get a sub-optimal scale factor on at least one of your monitors. IE11 adds per-monitor scaling support, so your web content scales to the correct level automatically as you drag the window between monitors. This is particularly useful when projecting from high DPI devices, as projectors are typically low DPI displays.
Unified optical zooming model
Windows Internet Explorer 8 and Internet Explorer 9 handle all zooming using a layout zoom model, which scales the size of everything except the viewport width and recalculates the page layout with the new larger sizes of the content. Internet Explorer 10 added an alternative, simplified zooming model, optical zoom, which simply scales the original 100% layout (thus avoiding a re-layout of the page).
With IE11, all zooming is now handled with optical zoom, making the experience across zooming scenarios (such as the Zoom menu, Pinch zoom, Keyboard / mouse shortcuts, @-ms-viewport, and msContentZoomFactor) much simpler and more predictable.
Compatibility notes
If your site is still using a legacy document mode (specifically, a docmode targeting Internet Explorer 9 or earlier), IE11 on Windows 8.1 will render your site using natural text metrics in order to avoid common glitches in font rendering (such as degraded kerning support) that are common with legacy document modes at non-100% zoom levels.
If you wish to opt out of this default behavior, you can use the following HTTP header or <meta> tag:
X-UA-TextLayoutMetrics: gdi
<meta http-equiv="X-UA-TextLayoutMetrics" content="gdi" />
For more info, see Optical Zooming in Legacy Document Modes.