Zapytania o media, które nie są stosowane wewnątrz elementu iframe aplikacji mobilnej

Question

Mam dziwny problem podczas ładowania witryny w elemencie iframe mojej aplikacji mobilnej. Mam stronę internetową z siedmioma stronami. Kiedy przeglądam mój adres URL w safari na iPhone'a. Zawartość wszystkich stron jest idealna. ale jeśli załaduję stronę internetową w elemencie iframe w mojej aplikacji mobilnej, Android prawidłowo wyświetli stronę internetową iframe aplikacji mobilnej. Ale w iPhone trzech stron, które przepełniają treść i nie widzę pełnej strony. Moje zapytania o media są wymienione poniżej. Przy okazji korzystam z frameworka bootstrap dla mojej witryny.

@media (min-width: 768px) and (max-width: 979px) { 
     // css goes here 
    } 
    @media (min-width: 768px) 
    { 
    // css goes here   
    } 
    @media (max-width: 767px) { 
    // css goes here    
    } 
    @media (min-width: 1200px) { 
     // css goes here    
    } 
    @media (min-width: 768px) and (max-width: 979px) { 
     // css goes here    
    } 
    @media (max-width: 767px) { 
     // css goes here 
    } 
    @media (max-width: 480px) { 
     // css goes here 
    } 
    @media (max-width: 320px) 
    { 
     // css goes here 
    } 
    @media (max-width: 240px) 
    { 
    // css goes here 
    } 
    @media (max-width: 979px) { 
    // css goes here 
    } 
    @media (min-width: 980px) { 
    // css goes here 
    } 

Czy są jakieś inne zapytania o media kierowane na element iframe w aplikacji mobilnej iPhone'a. Jestem nowy w tych responsywnych mediach. Proszę pomóż. Ponieważ w ciągu dwóch dni spotykam się z terminem klienta, muszę rozwiązać ten problem.

Z góry dziękuję.

Answer 1

Czasami przeglądarki nie renderują funkcji mediów. Spróbuj dodać to do swojej sekcji głowy. Może masz trochę szczęścia.

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi" />