Reguły css nie działają poprawnie na iOS9

Question

Mam problem z iOS9 o css witryny. Reguły css działają dobrze na Androidzie i iOS8. ale na iOS9 witryna zawiodła. to jest różnica ios8 i ios9.

Jaki jest potencjalny problem i jak można rozwiązać ten problem? Dzięki za pomoc.

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 and (max-width: 600px){ 
    section.destinations { 
     width: 100%; 
    } 
} 
@media screen and (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> 

Answer 1

nie natknął się na jeden z problemów kardynalnych dla IOS9 w środowisku internetowym. IOS9 nie honoruje żadnych zapytań o media.

jeśli twoje klasy żyją w zapytaniu o media dla określonego rozmiaru ekranu, nie będą czytane, a twoje css, twoje wyniki będą wyglądały tak samo na wszystkich urządzeniach, jak obecnie w IOS9. Problem został zgłoszony, ale firma Apple obecnie nie opublikowała harmonogramu zaktualizowanej wersji, aby rozwiązać ten problem.

Na mojej stronie wysłałem alert na wyświetlaczu: brak; z zapytaniem o media o klasie mniejszej niż 1920 pikseli, które będzie wyświetlane tylko na urządzeniach ios9 i tylko do momentu rozwiązania problemu.

/* Device Alert (all screen, < 1920px only)*/ 
@media screen and (max-width: 1920px) { 

<style> 
.alert { 
display:none; 
} 
</style> 
} 

<div class="alert"> 
IOS9 has caused display issues with this site. Please access the site on another platform until an update is issued. 
</div> 

Zasadniczo, jeśli zapytanie o media jest wyłączone, wyświetl: brak ;. Jeśli zapytanie o media nie zostanie wyłączone, wyświetl alert.

Mam nadzieję, że to pomoże na teraz.