UrlauberPB
Neues Mitglied
Hey Leute,
bin kein CSS Profi und hoffe hier kann mir jemand helfen?
Ich habe im nachfolgenden ein Problem mit den Div id="content2" und zwar läüft dieses über das Div id="content1" hinaus. Kann man das irgendwie abziehen? Des Weiteren würde ich gerne im Div id="header" die beiden Div Container unten ausrichten! Der Div id="header1" soll eine feste größe haben und der Rest vom Div id="header2" aufgefüllt werden. Bekomme da irgendwas nicht hin! Und hab die Übersicht verlohren! Kann mir jemand helfen ?
Hier der Quellcode: die Index
bin kein CSS Profi und hoffe hier kann mir jemand helfen?
Ich habe im nachfolgenden ein Problem mit den Div id="content2" und zwar läüft dieses über das Div id="content1" hinaus. Kann man das irgendwie abziehen? Des Weiteren würde ich gerne im Div id="header" die beiden Div Container unten ausrichten! Der Div id="header1" soll eine feste größe haben und der Rest vom Div id="header2" aufgefüllt werden. Bekomme da irgendwas nicht hin! Und hab die Übersicht verlohren! Kann mir jemand helfen ?
Hier der Quellcode: die Index
HTML:
<body>
<div class="bo1" id="box1">
<div class="to" id="top"></div>
</div>
<div class="bo2" id="box2">
<div class="he" id="header">
<div class="he1" id="header1"></div>
<div class="he2" id="header2"></div>
</div>
<div class="co" id="content">
<div class="co1" id="content1"></div>
<div class="co2" id="content2"></div>
</div>
</div>
<div class="bo3" id="box3">
<div class="bo" id="bottom"></div>
<div class="fo" id="footer"></div>
</div>
</body>
Code:
min-height: 100%;
min-width: 100%;
height:auto !important;
width:auto !important;
height:100%;
width:100%;
}
#box1{ /* Topbereich */
height:12px;
background-color:#F0F;
}
#top{
height:12px;
background-image:url(../images/top.png);
}
#box2{ /* Contentbereich */
position:absolute;
top:12px;
bottom:83px;
right:0px;
left:0px;
overflow-y:auto;
width:expression((document.body.clientWidth) + 'px');
height:expression((document.body.clientHeight - 95) + 'px');
background-color:#00F;
}
#header{ /* Headerbereich */
right:0px;
left:0px;
bottom:0px;
height:50%;
background-color:#0FF;
}
#header1{ /* Headerbereich */
}
#header2{
right:0px;
bottom:0px;
left:0px;
overflow-y:auto;
height:30px;
background-color:#F00;
}
#content{ /* Contentbereich */
bottom:83px;
right:0px;
left:0px;
overflow-y:auto;
height:50%;
background-color:#F00;
}
#content1{ /* Contentbereich */
right:0px;
left:0px;
overflow-y:auto;
height:30px;
background-image:url(../images/content.png);
position:absolute;
}
#content2{ /* Contentbereich */
right:0px;
left:0px;
overflow-y:auto;
height:100%;
background-color:#C93;
}
#box3{ /* Footerbereich */
position:absolute;
bottom:0px;
width:100%;
height:83px;
background-color:#0F0;
}
#bottom{ /* Footerbereich */
width:100%;
height:14px;
background-image:url(../images/bottom.png);
}
#footer{ /* Footerbereich */
width:100%;
height:69px;
background-image:url(../images/footer.png);
}