Unverständnis von CSS-Eigenschaften; Hintergrund der aktiven Navigationsauswahl ändern

[Auge]

Hallo

… da fehlt bei dir noch was.

Bei Systemen mit nicht überlagernder Scrollbar springt der Inhalt beim Seitenwechsel horizontal, wenn man von einer Seite mit wenig Inhalt (keine Scrollbar) zu einer mit viel Inhalt (mit Scrollbar) oder andersrum wechselt. Ich hab das in diesem Beispiel mit details simuliert.

War auf Deinem Link und habe auch den auskommentierten Bereich (mehrfach) gelöscht. Weder in Smartphone-Auflösung, noch in normaler Breitbildauflösung des Firefox habe ich einen Unterschied bemerkt. Und anscheinend verstehe ich auch Deine obige Erläuterung dazu nicht. Sorry

Wenn eine Website so kurz ist, dass sämtlicher Inhalt auf eine Bildschirmhöhe passt, wird im Firefox (von dem kenne ich das Verhalten) die Breite des Viewports über die gesamte verfügbare Breite gemessen und eine zentrierte Seite entsprechend eingepasst. Wechselt man dann auf der selben Website auf eine andere Seite, deren CSS-Regelwerk identisch ist, deren Inhalt jedoch hoch genug ist, um im Browserfenster einen senkrechten Scrollbalken zu benötigen, wird im Firefox nun die Breite der Seite unter Abzug der Breite des Scrollbalkens berechnet. Der Inhalt der zentrierten Seite springt nun um die halbe Scrollbalkenbreite nach links, da der Viewport jetzt schmaler ist, als jene ohne senkrechten Scrollbalken.

Das sieht man nur in einem solchen Szenario und es sieht unschön und unruhig aus.

Tschö, Auge