Witryna powiększa się po otwarciu menu

Question

Używam biblioteki PureCSS Yahoo wraz z wtyczką do paska bocznego i działa świetnie we wszystkich przeglądarkach z wyjątkiem mobilnego Safari. Z jakiegoś powodu jest on pomniejszony za każdym razem, gdy menu jest otwarte. Dzieje się tak nawet w dokumentacji example. Nie mam pojęcia, co może być przyczyną tego, ale jest to kuszące, aby nazwać to błędem przeglądarki.

Mogę połączyć JSFiddle w razie potrzeby.

Answer 1

To pytanie właściwie sprowadza się do tego, że jest takie samo jak Does overflow:hidden applied to work on iPhone Safari?. Chyba Mobile Safari spowoduje oddalenie, aby zrobić miejsce dla menu i obszaru zawartości, gdy użytkownik otwiera menu, chyba że zrobisz to na elemencie owijarki:

html, 
body { 
    overflow-x: hidden; 
} 

Answer 2

Metatag z rzutni nie zawiera maksymalnej wartości skali. W przypadku aktualizacji tag rzutni do następujących, nie dostaniesz tego samego powiększenia, gdy użytkownik kliknie w menu:

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

Zanotować dodawania z maximum-scale=1 do końca łańcucha. Po dodaniu zawartość przesuwa się zamiast pomniejszać. Zostało to przetestowane na stronie demonstracyjnej PureCSS dla wersji Responsive Side Menu, połączonej z powyższym.