iOS Safari - 100% Height fehlverhalten bei Navigationsleiste...

[scbawik]

Hallo Leute,

Bin jetzt kurz vor der Fertigstellung meiner neuen Seite. Es handelt sich dabei um eine 'Scrollseite' bei der alle Hauptseiten clientseitig per Ajax untereinander geladen werden und man so durch die Kategorien/Seiten scrollen kann. Dabei hat jede Seite mindestens 100% Höhe. Funktioniert soweit Spitze unter allen Desktops und Tablets.

Für Smartphones wollte ich aber eine eigene Version erstellen. Von der Funktionsweise her ist sie jedoch gleich wie die Desktop-Version. Unter Android funktioniert sie auch super, unter iOS hat sie aber ein wirklich lächerliches Problem:

100% Höhe bedeuten im Safari anscheinend:

Viewport - Safari-Navigationsleiste = 100%

Wenn die Navigationsleiste angezeigt wird, wäre dies ja korrekt. Wenn die Navigationsleiste jedoch vom Browser wieder nach oben ausgeblendet wird, zieht er trotzdem weiterhin die Navigationsleiste vom Viewport ab. Logisch wäre es wenn 100% ein dynamischer Wert wie in jedem anderen noch so alten Browser ist. Also immer die Höhe vom Parent. Unter Android verhält es sich zumindest so und dieser blendet die Navigationsleiste gleich wie Safari von oben ein und aus.

Aber ist sicher wieder ein Feature von Apple... Das Teil fliegt gleich zum Fenster raus :!:

Hoffe jemand von euch hat eine Lösung für mich... :)

html, body {     margin: 0px;
     width:100%;
     height:100%;
     position:relative;
}
.page {
     min-height:100%;
     height:100%;
     position:relative;
}

PS: Mit Navigationsleiste meine ich nicht das Menü meiner Seite sondern die Browserkomponente, also eigentlich Adressleiste, fällt mir gerade ein.