hey

Mir gefällts nich das sich zentrierte Sites, wenn der Content zu lange für den Screen ist & vertikal gescrolled werden muss, horizontal um die Scrollbalkenbreite verschieben.
Bsp Blue Tomato Shop
Die Site hier ist zentriert & für den Screen (Reso 1920x1200px) zu lange, es muss vertikal gescrolled werden, der Scrollbalken ist schon sichtbar, also jetzt noch kein horizontales verschieben der Page.

Klickt ganz oben in der Mitte, rechts neben KONTAKT, auf den Link WUNSCHZETTEL.
Diese Page paßt in nen Screen (Reso 1920x1200px) locker rein, die Folgen sind das der SB rechts verschwindet & der Content um die SB-Breite nach rechts rutscht. Wenn ihr n paar Mal zwischen der Mainpage & der WUNSCHZETTEL-Page hin- & herklickt erkennt man die Verschiebung ziemlich gut.

Habe jetzt mal rumgecheckt & bin auf der Google Site fündig geworden, die haben den vertikalen Scrollbalken als "toten Scrollbalken" (kein Plan wie man einen passiven Scrollbalken richtig nennt) eingefügt.
Bsp Google
Wenn ne Suchanfrage ausgeführt wird, wird der "tote Scrollbalken" aktiv & der Content verschiebt sich nicht.
Die Googlesite is n eher schlechtes Bsp, weil bei ner Suchanfrage sowieso n ganz anderes Layout verwendet wird, aber der Sinn der Sache bzw auf was ich hinaus will is hoffentlich verständlich.

Habe dann selbst probiert den "toten Vertikal-SB" in einer Site zu integrieren.
Ich lege bei Websites in der dazugehörigen CSS-file als erstes immer nen body-Selektor fest. In diesem body-Selektor habe ich die Eigenschaft overflow mit dem Wert scroll notiert. Dadurch werden der vertikale & der horizontale SB als "tote SB" vorgegeben.
Wenn man jetzt zu langen, nicht in den Screen passenden, zentrierten Content (ein zentriertes Wrapper-div das den restlichen Quellcode der Page beinhaltet) in die Page einfügt, gibt es kein verschieben mehr, die "toten SB" werden einfach aktiv.
Was ich aber bei dieser Methode häßlich finde & auf Google.de nicht vorhanden ist, ist der horizontale Scrollbalken. Der kommt so gut wie nie zum Einsatz & wird aber durch die Eigenschaft overflow auch mit vorgegeben.

So, & jetzt meine Fragen
- is mein Vorgehen bezüglich "einfügen von 'toten Scrollbalken' mit Eigenschaft overflow" richtig o geht das ganz anders, leichter, schneller, besser? ...whatever...

- gibts vielleicht ne ganze andere Methode, mit der beide (vertikale & horizontale SB) von vorne herein versteckt werden können & sich die Site beim switchen zwischen SB-pages & Nicht-SB-page aber trotzdem nicht horizontal verschiebt?

- wenn es keine andere Möglichkeit außer die overflow-Geschichte gibt, wie bekomme ich den häßlichen, nicht genützten Horizontal-SB weg bzw wie hat es Google geschafft nur den Vertikal-SB vorzugeben?
Gibts vielleicht ne Möglichkeit den Horizontal-SB zu verstecken o gar nich anzeigen zu lassen?

Bitte um Feedbackz, mercie im Voraus.

grTz, by REFRESH

also den Scrollbalken blendest du in der Tat mit
overflow:hidden
Am einfachsten wäre es nun mit Javascript dynamisch die Eigenschaft overflow ein- bzw auszublenden...

Wobei ich dein Problem noch nicht ganz verstehe. Laut dem Threadtitel nervt der horizontale SB.

Blende den doch standardmäßig mit "overflow-x:hidden" aus, oder brauchst du den noch irgendwo?

Mein Problem is wie oben bereits erklärt, dass es mir nich gefällt, wenn sich Sites um Scrollbalkenbreite horizontal verschieben, wenn der Content zu lange für n Screen is.

Die Sache mit "overflow-x:hidden" funktioniert ganz gut.
Man muss also beide Eigeschaften (overflow & overflow-x) notieren:

body {
background-color: #CCC;
padding: 0px;
margin: 0px;
overflow: scroll;
overflow-x: hidden;
}

Aber wenn jetzt eben irgendwer mit ner superkleinen Reso (zB 800x600px) ankommt, oder das Browserfenster eben mal halbiert oder zusammengeschoben bzw verkleinert wird, bleibt der horizontale SB trotzdem hidden & für die User besteht keine Möglichkeit, das sie horizontal scrollen.

Habe noch keine Erfahrung mit JS & wie ich deinen Vorschlag umsetzen soll...
Hast du für das dynamische Ein- Ausblenden der SB n Script?

nunja ganz so fit bin ich mit javascript auch noch nicht.
Allerdings besteht mit Javascript die Möglichkeit die Aktuelle Browserfenstergröße zu ermitteln und dann per if() zu sagen, wenn Browserfenster kleiner als xy -> dann blende horizontalen SB ein.

Das wirkt in aktuellen Browserversionen, ältere haben Pech gehabt. Macht aber nichts, ist ja nicht lebenswichtig.

Nicht das body-Element anfassen, schon gar nicht mit hidden.

__________________
Corina Rudel

Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken

PERFECT!
Der Tipp von fricca ist die perfekte Lösung, mercie dafür

Der vertikale Scrollbalken wird als "toter Balken" angezeigt, wenn er gebraucht wird tritt er in Aktion & verschiebt die Site aber nicht.
Der horizontale SB wird gar nicht angezeigt & erscheint nur, wenn er gebraucht wird & selbst wenn er dann plötzlich vorhanden is, kann er nichts verschieben.

& das Ganze ohne großes Rumgespiele mit JS o Ähnlichem, obwohl zejis Ansatz auch nich schlecht war