Viewport Meta Tag: Minimal-UI

With the introduction of iOS 7.1 Safari understands a new viewport meta tag which automatically reduces the mobile Safari ui to a minimum. I think it’s a great addition and hope other browsers will support it in the future, too.

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

Here is my blog before and after adding minimal-ui:


Hint: As a user you can get the menu bar back by tapping on the url.

Update: I wrote a follow up post explaining why minimal-ui might not be such a good idea.


13 responses to “Viewport Meta Tag: Minimal-UI”

  1. […] Minimal viewport tag in iOS 7.1 […]

  2. I didn’t know that safari was updated in the latest update. I am on a jailbroken iPhone 5s with 7.0.6 and you are correct (it only works with devices running safari on 7.1). thanks for sharing! I will definitely have some use cases where this will come in handy, and hopefully other browsers follow suite.

  3. Ian Firth says:

    7.0 did this as soon as you started scrolling. With 7.1 on a 4s test device, I see no difference with this tag added than previously.

  4. Dominick says:

    This occurs on my site without the meta tag. It’s an automatic feature of safari itself caused by scrolling, it’s not a meta tag.

  5. Loris says:

    This is a good thing to know but as tapping on the top bar isn’t that intuitive, I would leave this for webapps or really specific uses.

  6. Jonathan says:

    Guys, its a meta tag feature for sure. Normally the bar would change on scrolling up again but it’s not happening with this meta tag. Only when you tap on it.

  7. Martin says:

    What Jonathan says is right. That said, I’m not so sure anymore if this is really a good thing for normal websites because it might be confusing for the average user.

  8. Jamie says:

    Not sure I really like this. I believe things like this should really be left up to the vendor and end user. So now you go to one website and the URL bar is hidden, then another and it isn’t? Seems like that will do nothing but add confusion to the end user, which is never a good thing.

  9. koDiacc says:


    I’m wondering why my Chrome (latest version) puts this error in my console:

    “The key “minimal-ui” is not recognized and ignored. “


  10. […] post on the new viewport meta tag minimal-ui was quite popular, but equally controversial. Some love the addition by Apple and some […]

  11. Bailey says:

    Good find! Looking forward to testing this out on sites with height: 100% or top:0, bottom:0.

    iOS7’s Safari didn’t trigger a refire of the viewport event when the UI moved and resized the viewport, a really annoying behavior.

  12. […] some-more about it here. When IOS 7 only came out, this was a vast problem for iphone apps, since a Safari interface stole […]

Leave a Reply

Your email address will not be published. Required fields are marked *