CSS - "position: fixed" verhält sich in Firefox wie "absolut"

Question

Jan 29, 2014, 08:23 PM

CSS - "position: fixed" verhält sich in Firefox wie "absolut"

Ich habe eine Website in Safari erstellt und sie gerade in Firefox getestet, und meine festen Navigationselemente verhalten sich so, als ob ihre Position absolut ist.

#navigation {
    display: block;
    width: 100%;
    height: 50px;
    position: fixed;
    left: 0px;
    bottom: 0px;
    text-align: center;
    z-index: 99000;
}

Dies ist das CSS, das ich für den primären Navigations-Wrapper habe (es ist ein Bottom-Navi). In Webkit funktioniert es perfekt: Das heißt, es bleibt unabhängig davon am unteren Rand des Fensters hängen. In Firefox positioniert es sich am Ende der Tags, sodass ich zum Beispiel auf einer langen Seite nach unten scrollen muss, um es zu sehen. Es tut so, als ob es absolut wäre.

Ich habe auch eine Sidebar-Navigation.

.slidebar {
    display: block;
    position: fixed;
    left: -1px;
    top: -1px;
    width: 1px;
    height: 100%;
    overflow: hidden;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    transition: all 300ms ease;
    z-index: 99998;
}

Diese Seitenleiste verhält sich auch so, als ob sie absolut wäre - das heißt, sie positioniert sich ordnungsgemäß außerhalb des Bildschirms, verlängert sich jedoch<body> und somit erscheint die horizontale Bildlaufleiste. Dasheight: 100%; reagiert auch auf die<body> Höhe und nicht die Fensterhöhe, also zum Beispiel meine<header> hat einen oberen Rand von 20px, und der Schieberegler beachtet auch diesen Rand (der Körper hat 0 Rand). Ebenso anstelle derheight: 100%; Sie endet am unteren Rand des Fensters und am unteren Rand des Fensters<body>Berücksichtigung des unteren Randes der Fußzeile.

Ich kann für mein Leben nicht verstehen, warum dies geschieht. Die Überprüfung der Elemente zeigt, dass alle Eigenschaften einwandfrei geladen werden. In Chrome und Safari funktioniert dies. Es hat anfangs funktioniert und es hat funktioniert, als ich das letzte Mal eine Navigation bearbeitet habe, aber seitdem funktioniert es nicht mehr, seit ich andere, irrelevante Teile der Site erstellt habe.

http://www.upprise.com/demo.php - Klicken Sie auf das Umschlagsymbol, um die Seitenleiste anzuzeigen

Zu kommentieren