AnsweredAssumed Answered

How to set CSS for iPhone 3 and 4 applications?

Question asked by geoffreywestgis on Sep 15, 2014

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">

Outcomes