After updating to IOS 9 on an iPad or iPhone, content may suddenly become squished so that a site that once filled the entire screen now takes up half of it! Why does this happen?

A change in the way the viewport meta tag for sites using “width=device-width” works causes the page to scale down to fit content that overflows the viewport bounds. Frequently sliders or carousels place a website in this situation because of how they set the width. In this case, the scale down to fit is definitely not the desired layout.

Fortunately, there is a simple work around to fix this issue. Simply modify the viewport meta tag to include “shrink-to-fit=no” :

1

<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">