nicht angemeldet
Hallo,
seit über zwei Stunden brüte ich über folgendem Problem:
Ich habe einen div-Bereich "Container_Anzeigebereich" mit festgelegter Höhe und Breite 494px. Innerhalb dieses div-Bereiches ist der div "Anzeigebereich" eingebettet, der ebenfalls eine feste Breite hat (Abstand rechts und links jeweils 10px, somit 474px):
+------------------------------------------+
| |
| div "Interface" |
| |
| +--------------------------------+ |
| | | |
| | div "Container_Anzeigebereich" | |
| | | |
| | +----------------------+ | |
| | | | | |
| | | | | |
| | | div "Anzeigebereich" | | |
| | | | | |
| | | | | |
| | +----------------------+ | |
| | | |
| +--------------------------------+ |
| |
+------------------------------------------+
Der div-Bereich "Interface" enthält die grafische Aufmachung der Seite inkl. linksseitiger Navigation, im div-Bereich "Anzeigebereich" werden die eigentlichen Seiten (Gästebuch, Kontakt, Disclaimer,...) angezeigt, der div-Bereich "Container_Anzeigebereich" dient der Ausrichtung des div-Bereiches "Anzeigebereich" zur Grafik des div-Bereiches "Container_Anzeigebereich".
Nun zu meinem Problem:
Solange die Seiten kürzer als die Höhe des div-Bereiches "Anzeigebereich" ist, ist alles in Ordnung.
Wenn allerdings ein vertikaler Scrollbalken angezeigt wird, ist die Optik insofern nicht mehr stimmig, weil der Text am Scrollbalken klebt, obwohl hier ein Abstand zum Scrollbalken UND zum rechten Rand des div-Bereiches "Container_Anzeigebereich" sein sollte.
Hier habe ich euch folgende Screenshots hochgeladen:
- Layout ohne angezeigter Seite (http://img190.imageshack.us/img190/5422/layoutohneangezeigterse.png)
- Zustand ohne Scrollbalken (http://img851.imageshack.us/img851/3316/zustandohnescrollbalken.png)
- Zustand mit Scrollbalken (http://img69.imageshack.us/img69/1796/zustandmitscrollbalken.png)
Hier der entsprechende Code:
div#Interface
{
background: url(../../GRAFIKEN/Interface.png);
height: 588px;
left: 50%;
margin: -294px 0px 0px -368px;
position: absolute;
top: 50%;
width: 736px;
}
div#Container_Anzeigebereich
{
background-color:red;
bottom: 15px;
height: 539px;
right: 2px;
position: absolute;
width: 494px;
z-index: 30;
}
div#Anzeigebereich
{
background-color:yellow;
bottom: 0px;
left: 0px;
margin-right: -10px;
overflow: auto;
padding-right: 10px;
position: absolute;
right: 10px;
top: 0px;
z-index: 30;
}
Die background-Angaben habe ich lediglich zu dem Zweck eingebaut, um die Abstände und Ausrichtungen sichtbar kontrollieren zu können.
Was muss ich ergänzen/welche Angaben muss ich ändern, damit der rechte Abstand der Seiten (div "Anzeigebereich") immer 10px beträgt, sowohl wenn kein Scrollbalken angezeigt wird, als auch, wenn einer angezeigt wird?
Vielen Dank im Voraus für eure Unterstützung.
Gruß
Enrico
PS: Ich hatte hier schon mal angefragt (http://forum.de.selfhtml.org/archiv/2010/9/t200293/#m1349507), leider habe ich aufgrund eines Festplatten-Crashs aber alle Daten verloren und mich erst kürzlich dazu entschlossen, nochmals neu anzufangen.