Div sind bei 100% zu lang
Markus Mayer
- css
Hallo
Ich hab ein 3 Spaltiges Layout inkl einem Banner.
Die Linke und die Rechte Spalte sollen immer 100% height haben.
Wenn ich jetzt height 100% angebe sind die aber viel zu lang und gehen Bannerhöhe + xPixel zu weit nach unten und es gibt Scrollbalken.
Wie kann ich es anstellen das die wirklich nur bis zum unteren Rand gehen und nicht weiter.
Hier der code:
css:
/* CSS Document */
body{
margin:0;
padding:0;
line-height: 1.5em;
}
html,body {
height:100%;
}
#maincontainer{
width: 950px; /*Width of main container*/
margin: 0 auto; /*Center container on page*/
height:100%;
}
#topsection{
background: #fff4cc;
height: 170px; /*Height of top section*/
}
#contentwrapper{
float: left;
width: 100%;
}
#contentcolumn{
margin: 0 340px 0 170px; /*Margins for content column. Should be "0 RightColumnWidth 0 LeftColumnWidth*/
}
#leftcolumn{
float: left;
width: 170px; /*Width of left column in pixel*/
margin-left: -950px; /*Set margin to that of -(MainContainerWidth)*/
background: #C8FC98;
height:100%;
}
#rightcolumn{
float: left;
width: 340px; /*Width of right column*/
margin-left: -340px; /*Set left margin to -(RightColumnWidth)*/
background: #FDE95E;
height:100%;
}
#footer{
clear: left;
width: 100%;
background: black;
color: #FFF;
text-align: center;
padding: 4px 0;
}
#footer a{
color: #FFFF80;
}
.innertube{
margin: 10px; /*Margins for inner DIV inside each column (to provide padding)*/
margin-top: 0;
}
html:
<body>
<div id="maincontainer">
<div id="topsection">Banner</div>
<div id="contentwrapper">
<div id="contentcolumn">
<div class="innertube">Content</div>
</div>
</div>
<div id="leftcolumn">
<div class="innertube">Menu</div>
<div class="innertube">U_Menu</div>
</div>
<div id="rightcolumn">
<div class="innertube">Rechte Bildleiste</div>
</div>
</div>
</body>
Hallo
Hi,
margin-left: -950px; /*Set margin to that of -(MainContainerWidth)*/
Diese ganzen margin-left im Minusbereich sind schon sehr eigenartig :-.
Versuchs hiermit.
Gruß, Volker