TJ VanToll

Effect of iOS 7.1's minimal-ui Viewport Property

| Comments

One of the major, and not well-received changes introduced in iOS7 was the lack of a true full screen mode. Apple’s answer was the introduction of a minimal-ui viewport property in iOS 7.1, which was released yesterday.

I wanted to quickly show the effect this property has. Adding it is as easy as appending minimal-ui to the content attribute of your site’s <meta> tag.

<meta name="viewport" content="width=device-width, initial-scale=1, minimal-ui">

The two images below show a before and after of applying the property to a test page.

Without minimal-ui property status bars display With minimal-ui status bars do not show