首先,我已经研究了所有选项,你们专业人士会说我没有,但我有:) 我就是想不通。白色背景不会随着子 div 的扩展而扩展。
这是CSS
#container{
position: relative;
background-color: #FFF;
width: 900px;
height: auto;
margin-top: 50px;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
border: 2px solid #FFF;
}
#banner {
height: 60px;
width: 900px;
background-color: #CFF;
color: #F00;
}
#menu{
position: absolute;
top: 59px;
height: 150px;
left: -2px;
width: 100px;
border: 2px solid #FFF;
color: #250517;
background-color: #6D6968;
}
#menulogin{
position: absolute;
top: 209px;
height: 100px;
left: -2px;
width: 100px;
border: 2px solid #FFF;
color: #250517;
background-color: #6D6968;
}
table {
border: none;
}
#content {
position: absolute;
height: auto;
left: 105px;
width: 789px;
text-align:left;
padding-left: 5px;
}
这些是div:
<body>
<div id="container">
<div id="banner"> Dit is de <strong>BETA</strong> van roekoerace.be! </div>
<div id="menu">
<table width="100" border="" cellspacing="2" cellpadding="0">
<tr>
<td><a href="../login.php">Login</a></td>
</tr>
<tr>
<td><a href="../index.php">Profiel</a></td>
</tr>
<tr>
<td><a href="../duifkes.php">Duiven</a></td>
</tr>
<tr>
<td>Wedstrijden</td>
</tr>
<tr>
<td>Training</td>
</tr>
<tr>
<td>Markt</td>
</tr>
</table>
</div>
<div id="menulogin"><!-- TemplateBeginEditable name="LoginMenu" --><!-- TemplateEndEditable --></div>
<div id="content"><!-- TemplateBeginEditable name="Inhoud" --><p> </p><!-- TemplateEndEditable -->
</div>
</div>
</body>