css rules doesn't work properly on iOS9 -

-

i have problem ios9 site's css. css rules works fine on android , ios8. on ios9, site messed up. difference ios8 , ios9.

enter image description here

what possible problem , how can fix this? help.

css:

section.destinations {     float: left;     width: 82.5%;     display: inline-block;     position: relative;     overflow: hidden;     margin: 0 auto;     font-weight: 300;     font-size: 1.25em; } .content-wrap {     position: relative;     border-radius: 5px; } .content-wrap section {     margin: 0 auto;     max-width: 1200px;     text-align: center;     padding: 10px;     border-radius: 5px;     background-color: white;     display: block; } .destinations .promo {     position: relative;     background: #fff;     webkit-box-shadow: 0 0 2px rgba(0,0,0,1);     -moz-box-shadow: 0 0 2px rgba(0,0,0,1);     box-shadow: 0 0 2px rgba(0,0,0,1);     float: left;     width: 23%;     margin: 0 2.6% 20px 0;     font-size: 10px;     text-align: left;     display: block; } @media screen , (max-width: 600px){     section.destinations {         width: 100%;     } } @media screen , (max-width: 410px){     .full .one-fourth {         width: 100%!important;         margin: 0 auto 15px!important;      } }

html:

<section class="destinations clearfix full tabs tabs-style-tzoid">     <div class="content-wrap">         <section id="section-tzoid-1" class="content-current">            <!--column-->             <article class="one-fourth promo" style="">              </article>             <!--//column-->            <!--column-->             <article class="one-fourth promo" style="">              </article>             <!--//column-->             <div class="clearfix"></div>         </section>     </div> </section>

you've stumbled on 1 of cardinal problems ios9 in web environment. ios9 not honor media queries.

if classes live in media query specific screen size, won't read , css, output same on devices in ios9. issue has been reported apple has not released schedule updated version resolve this.

in site, ive posted alert in display: none; media query of less 1920 px class displayed on ios9 devices , until problem resolved. 

/* device alert (all screen, < 1920px only)*/ @media screen , (max-width: 1920px) {  <style> .alert { display:none; } </style> }  <div class="alert"> ios9 has caused display issues site. please access site on platform until update issued. </div>

basically, if media query excepted, display:none;. if media query not excepted, display alert.

hope helps now.


Comments

Post a Comment

Popular posts from this blog

java - Date formats difference between yyyy-MM-dd'T'HH:mm:ss and yyyy-MM-dd'T'HH:mm:ssXXX -

-
i trying parse date 2014-12-03t10:05:59.5646+08:00 using these 2 formats: yyyy-mm-dd't'hh:mm:ss yyyy-mm-dd't'hh:mm:ssxxx when parse using yyyy-mm-dd't'hh:mm:ss works fine, when parse yyyy-mm-dd't'hh:mm:ssxxx parseexception thrown. which correct format parse date , difference between these 2 formats? note : cannot use joda :( those valid formats: yyyy-mm-dd't'hh:mm:ss.sssz >>> e.g.: 2001-07-04t12:08:56.235-0700 yyyy-mm-dd't'hh:mm:ss.sssxxx >>> e.g.: 2001-07-04t12:08:56.235-07:00 edit: btw, "x" refer (iso 8601 time zone)
Read more

c# - Get rid of xmlns attribute when adding node to existing xml -

-
i have xml-file: <ns2:root xmlns:ns2="namespace"> <ns2:a> <ns2:b>some content</b> <ns2:c>some content</c> <ns2:d>some content</d> </a> </root> i need add new node in specific place, code is: var doc = xdocument.load(file); xnamespace ns2 = "namespace"; doc.element(ns2 + "root").element(ns2 + "a").element(ns2 + "c").addafterself( new xelement(ns2+"new", new xelement("new1", new xelement("new2","some content"), new xelement("new3", "some content")))); the output is: <ns2:root xmlns:ns2="namespace"> <ns2:a> <ns2:b>some content</b> <ns2:c>some content</c> <ns2:new> <new1 xmlns=""> <new2>some content</new2> ...
Read more