Scrollbar verschiebt Design!
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
ausblenden
auto
bildschirmrand
browser
design
eigenschaft
entfernen
geheimnis
http
kleiner unterschiede
layout
legen
leute
nachteil
regel
richtigen stichworte
tip
url
verhindern
vorredner
-
Hallo Leute,
ich arbeite in meinem Webdesign mit "margin:auto;", nun wird das Design allerdings immer (wenn Scrollbar rechts vorhanden) wieder verschoben (um die dicke der Scrollbar nach links). Gibt es einen Weg dies zu verhindern? -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Das ist vollkommen normal - dein Design soll ja mittig angezeigt werden, d.h. in der Mitte der Seite. Und da die Seite kleiner wird, verschiebt sich auch das Design.
-
Um das zu verhindern müsstest du die ganze Seite in einen Container mit einer festen statischen Breite (px) legen. Wenn dann die vertikale Scrollbar erscheint wird unten einfach eine horizontale Scrollbar angezeigt. Der Nachteil ist allerdings das du für jede Bildschirmgröße und Auflösung eine Variante machen musst damit dein Layout auf den meisten Geräten passt. Aber in der Regel kann man das auch mit dem richtigen Formatieren des Layouts richtig hinbekommen. Ich habe mal gegoogelt ob man die Scrollbar verbieten kann. Doch das ist nur in einem iFrame möglich und da können auch nur beide ausgeblendet werden.
Gruß S.Brosch -
Das Ausblenden der Scrollbar ist Möglich, allerdings ist der gesamte Content dann nicht mehr Scrollbar (Man sieht nicht was über den Bildschirmrand geht).
Kann man das Margin:auto nicht so programmieren, das es minus die dicke der Scrollbar ist?
Beitrag zuletzt geändert: 18.1.2011 14:35:39 von das-dorf -
Du könntest mit overflow: scroll; die Scrollleisten immer erzwingen und dann dein Layout daran anpassen. Das ist zwar nicht die schönste Lösung, aber damit würde es überall ziemlich gleich angezeigt werden (mit Ausnahme kleiner Unterschiede bei der Breite der Scrollleisten, da die ja von Browser/System abhängt).
-
Mein Vorredner hat schon fast die richtigen Stichworte gebracht, overflow ist das Geheimnis, und auch der Wert scroll ist richtig, allerdings würde ich body { overflow-y: scroll; } empfehlen, da dann nur die Scrollbar an der Seite erscheint und nicht auch noch unten.
Diese Definition funktioniert auch in allen Browsern.
Übrigens als Tipp, im IE6 kann man so auch die nervige Scrollbar unten zu entfernen: body { overflow-x: hidden; }
Mit freundlichen Grüßen -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage