Question: I seem to have an issue with iOS 7.1's `minimal-ui` feature when used in conjunction with the smart app banner.

I have a gap at the top of the page, with the app banner overlaying the page content.

I've turned all styles off in my page, so I know its not my own CSS causing this.

Is this an iOS bug?

**Edit:** Demo: [demo](http://blog.muonlab.com/wp-content/uploads/2014/03/ios.html)

and a screenshot:

![Gap above page](https://i.stack.imgur.com/ib4ni.jpg)

Answer: 
If you don't mind using a bit of javascript here is how I fixed it.

```
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=0, minimum-scale=1.0, width=device-width, minimal-ui" />
<script>
    document.body.scrollTop = 0;
    document.write('<meta name="apple-itunes-app" content="app-id=XXXXXXXX"/>');
</script>

```

This basically forces a scroll before telling Safari to use the banner.
The `minimal-ui` viewport property is **no longer supported** in iOS 8 (see [iOS 8 Release Notes](https://developer.apple.com/library/prerelease/ios/releasenotes/General/RN-iOSSDK-8.0/)).

Therefore, my recommendation is to **not use `minimal-ui`** at all and the smart banner will display just fine.