CSS Feste position auf mobilen Browsern

Ich bin mir nicht sicher, ich kann explaint klar, was das problem ist, also bitte Verständnis.

Habe ich diesen HTML-code:

<div id="container">
    <div id="navbar">
        ...
    </div>
    <div id="content">
        ...
    </div>
</div>

Hier ist der CSS-code:

#container {
    display: block;
    width: 640px;
    height: 480px;
}
#navbar {
    display: block;
    position: fixed;
    width: 640px;
    height: 70px;
}
#content {
    display: block;
    marign: 70px 0 0 0;
    width: 640px;
    height: 410px;
    overflow-y: auto;
}

Es funktioniert auf desktop-und Android-Basis-browser, aber im iPhone Safari... Wenn ich zoom-in auf dieser Seite der Inhalt funktioniert gut, aber die fester Bestandteil bleiben auf position relativ zum Bildschirm. Jedem anderen element verschieben in Ordnung.

Was ist das problem? Ich habe keine Ahnung...

InformationsquelleAutor netdjw | 2013-02-13
  2. -1

    versuchen auf diesen code http://jsfiddle.net/nandhakumarsri9/bkwLG/

    #container {
    display: block;
    width: 640px;
    height: 480px;
    border: 1px solid #000;
    box-sizing: border-box;
    position: relative;
}
#navbar {
    display: block;
    position: absolute;
    width: 640px;
    height: 70px;
    border: 1px solid #F00;
    box-sizing: border-box;
}
#content {
    display: block;
    width: 640px;
    height: 410px;
    overflow-y: auto;
    border: 1px solid #00F;
    box-sizing: border-box;
    position: absolute;
    top: 70px;
}
    InformationsquelleAutor Nandhakumar
  3. -1

    Meisten mobilen Browser haben problem mit der festen Positionierung. Versuchen Sie, unter Verwendung der jQuery-mobile-framework mit data-position="fixed" - Attribut.

    InformationsquelleAutor Someone
Schreibe einen Kommentar