Enrico: [ CSS u. evtl. JS ] Scrollbalken

Beitrag lesen

Hallo,

tut mir leid, Euch wieder bemühen zu müssen, aber ich komme einfach nicht weiter.

Damit der Inhalt einer Seite nicht das Layout "zerreisst", habe ich innerhalb einer Tabellenzelle zwei verschachtelte Div-Bereiche definiert:

<div class="Container">
  <div class="Inhalt">
    ... Seiteninhalt ...
  </div>
</div>

.Container
{
  position: relative;
  width:    100%;
  height:   100%;
}

.Inhalt
{
  position: absolute;
  width:    100%;
  height:   100%;
  overflow: scroll;
}

Wenn ich nun einen Text habe, der länger als der zur Verfügung stehende Bereich ist, dann wird ein vertikaler Scrollbalken angezeigt (was ja auch beabsichtigt ist).

Was mir allerdings nicht gefällt, ist, dass der Text keinen Abstand zum Scrollbalken hat und das ganze dann ziemlich unschön aussieht.

Beabsichtigt wäre, dass der Text 14px Abstand zum Scrollbalken hat, WENN der Text länger als der Anzeigebereich ist, ansonsten soll sich der Inhalt zu 100% über den zur Verfügung stehende Bereich erstrecken.

Ich habe zwar einige Javascripte gefunden, die Layer scrollen, aber ich möchte auf die browsereigenen Scrollbalken zurückgreifen und ohne Javascript scrollen.

Dass mein Vorhaben aber ohne Javascript nicht umzusetzen sein dürfte, ist mir klar, da ich ja den Umstand abfragen muss, ob die Seite länger oder kleiner als der Anzeigebereich ist und damit der vertikale Scrollbalken mit Abstand oder kein Scrollbalken angezeigt wird.

Kann mir hier jemand behilflich sein und entsprechende Anregungen und / oder Links geben, die mich weiterbringen ?

Wäre super :-)

Schon mal vielen Dank, Enrico