title: Disable Internet Explorer 11 Auto Scaling Zoom to Viewport Width - IE11
body: <p>Is there any way to prevent the "auto zoom to viewport width" (a.k.a. automatic scaling) feature in Internet Explorer 11?</p>
  
  <p>I want to force the browser to follow my <code>max-width</code> rule and prevent it from auto-scaling the page contents to the full width of the viewport.</p>
  
  <p>I'm seeing the issue in IE11 on Surface Pro 2 in both "desktop" and "metro" modes. The issue is discussed <a href="https://connect.microsoft.com/IE/feedback/details/804990/internet-explorer-11-auto-zoom-feature-within-ie11" rel="nofollow">here</a> and may be related to external displays, although I'm experiencing it with or without an external display attached, and the zooming occurs on both the Surface monitor and on external displays.</p>
  
  <p>This <a href="http://msdn.microsoft.com/en-us/library/ie/hh869615%28v=vs.85%29.aspx" rel="nofollow">page</a> in the Microsoft docs suggests you can opt out of "automatic scaling" using this CSS rule:</p>
  
  <pre><code>@media screen {
      @-ms-viewport {
          width: device-width;
      }
  }
  </code></pre>
  
  <p>But that's not working for me; all it does it hide the vertical scrollbar by default. Pages still zoom to the full width of the viewport, ignoring any <code>max-width</code> values set in the CSS.</p>
  
  <p>Here's what it says in the <a href="http://msdn.microsoft.com/en-us/library/ie/hh869615%28v=vs.85%29.aspx" rel="nofollow">docs</a>:</p>
  
  <blockquote>
    <p>By default, the Internet Explorer in the new
    Windows UI automatically scales content when the window is narrower
    than 1024 pixels. This primarily includes the snapped state and
    portrait mode.</p>
    
    <p>However, in cases where this automatic scaling is not
    needed or desired, the device-width keyword can be used. This keyword
    signifies that the page is optimized to work well regardless of the
    width of the device.</p>
  </blockquote>
  
  <p>What I'm experiencing is actually the opposite of what the docs say. When the viewport is <strong>wider</strong> than 1024 pixels, content is automatically scaled.</p>
  
  <p>--</p>
  
  <p>Here's what I have set for my meta viewport tag:</p>
  
  <pre><code>&lt;meta name="viewport" content="width=device-width,initial-scale=1"&gt;
  </code></pre>