nicht angemeldet
Hallo,
ich versuche jetzt, mein Vorhaben über eine eigene div-Konstruktion umzusetzen:
+-----------------------------------------------------------------------+
|div "Abstand_Oben" |
+-------------------+------------------------------+--------------------+
|div "Abstand_Links"| div "Anzeigebereich" |div "Abstand_Rechts"|
| | | |
+-------------------+------------------------------+--------------------+
|div "Abstand_Unten" |
+-----------------------------------------------------------------------+
Die Ausgabe der div-Bereiche "Abstand_Oben", "Abstand_Links" und "Abstand_Rechts"
funktioniert, beim div-Bereich "content" leider nur an links, oben und rechts
(dies habe ich über die gelbe Umrandung festgestellt - mehr dazu im nachfolgenden
Code).
Was ich noch nicht umgesetzt bekommen habe ist der Abstand unten mit dem gleichnamigen
div-Bereich.
Der Code sieht folgendermaßen aus:
<html>
<head>
<style>
html,
body
{
border: 0px;
height: 100%;
margin: 0px;
max-height: 100%;
overflow: hidden;
padding: 0px;
}
.Anzeigebereich
{
display:block;
height:100%;
max-height:100%;
overflow:hidden;
position:relative;
z-index:3;
background:red;
border:2px solid yellow;
}
.Abstand_Links
{
display:block;
background:green;
width:195px;
height:100%;
float:left;
}
.Abstand_Rechts
{
display:block;
width:69px;
height:100%;
float:right;
background:blue;
}
.Abstand_Oben
{
display:block;
height:22px;
position:relative;
top:0px;
background:gray;
}
.Abstand_Unten
{
display:block;
height:22px;
position:absolute;
bottom:0px;
background:gray;
}
</style>
</head>
<body>
<div class="Abstand_Links"></div>
<div class="Abstand_Rechts"></div>
<div class="Abstand_Oben"></div>
<div class="Abstand_Unten"></div>
<div class="Anzeigebereich">
</div>
</body>
</html>
Ich hoffe, dass mein Ansatz nicht bloße Glückssache war, das Ergebnis gibt mir, wenn
aktuell leider auch nur zum Teil, recht, bis auf dasProblem, dass der div-Bereich
"Anzeigebereich" nicht bündig mit dem unteren Rand des Browserfensters abschliesst
(dann würde ich den zu Testzwecken anzuzeigenden gelben Rahmen unten sehen).
Vielleicht gibt es auf diesem Wege ja eine Lösung.
Gruß
Enrico