Select to view content in your preferred language

How to set CSS for iPhone 3 and 4 applications?

866
0
09-15-2014 12:02 PM
GeoffreyWest
Frequent Contributor

I have an application developed with a Local Government template.  It renders fine on a Samsung Note, meaning that my title bar appears.  On an iPhone the title does not appear. Below is my CSS which is taken from the template, along with my html parameters.  When I have changed the max-device-width, nothing changes when viewing the application on an iPhone, I have not had the opportunity to try with an Android Device yet after changing the max px.

@media screen and (max-height:320px){.esriPopup .contentPane{max-height:480px}}

@media screen and (max-height:500px){.esriPopup .contentPane{max-height:250px}}

@media screen and (max-height:450px){.esriPopup .contentPane{max-height:111px}}

@media screen and (max-height:400px){.esriPopup .contentPane{max-height:150px}}

@media screen and (max-height:350px){.esriPopup .contentPane{max-height:100px}}

@media screen and (max-height:300px){.esriPopup .contentPane{max-height:50px}}

    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=yes">

    <meta name="mobile-web-app-capable" content="yes">

    <meta name="apple-mobile-web-app-capable" content="yes">

    <meta name="apple-mobile-web-app-status-bar-style" content="default">

Tags (2)
0 Kudos
0 Replies