Peter Bucher - Mein Experiment, meine Spielereien, meine Welt...   ·   Stefan Falz   ·   Jürgen Gutsch   ·   Golo Roden   ·   ASP.NET Zone   ·   Microsoft ASP.NET
Willkommen bei ASP.NET Zone. Anmelden | Registrieren | Hilfe

CSS: Vertikaler Scrollbalken erzwingen

Bei Webseiten die nicht über die Höhe des Browsers (Viewports) hinausgehen, also relativ wenig Inhalt haben, gibt es beim Wechsel zu einer Seite die darüber hinausgeht ein horizontales verschieben der Seite.

Das Problem entsteht, weil z.B. Firefox / Chrome den vertikalen Scrollbalken bei nicht ausreichendem vertikalem Inhalt weglassen.
Der Internetexplorer hat dieses Problem nicht und zeigt das meines Erachtens korrekte Verhalten: Er zeigt den vertikalen Scrollbalken immer an.

Um dieses korrektere Verhalten in allen Browsern zu erzwingen gibt es verschiedene Lösungen.

Die nicht valide Lösung, die inzwischen in jedem aktuellen Browser laufen sollte:

html {
    overflow-y: scroll;
}

 

 

Oder die valide Lösung, die auch in älteren Browsern läuft, jedoch durch das 1% erzwungene mehr an Höhe, diese etwa 10 Pixel unten auch an die sonst leere Seite anhängt:

html {
    height: 100%;
}
body {
    height: 101%;
}

 

 

Alternativ dazu sollte auch folgendes funktionieren:

html {
    height: 100%;
    margin-top: 1px;
}

Habt ihr andere Lösungen oder Kommentare zu diesen hier? Schreibt in die Kommentare.

Veröffentlicht Mittwoch, 16. Oktober 2013 19:17 von Peter Bucher
Abgelegt unter: , , ,

Kommentare

Keine Kommentare
Anonyme Kommentare sind nicht zugelassen