我无法做两件事。我似乎总能完成一个,但不能完成另一个。我希望我的页脚始终显示在页面底部并占据内容容器的100%宽度。
html,
body {
margin: 0px;
padding: 0px;
height: 100%;
width: 100%;
border: none;
}
#wrapper {
position: relative;
width: 100%;
min-width: 940px;
min-height: 100%;
height: 100%;
border: 1px solid #ff0000;
}
#nav_open {
position: absolute;
top: 0px;
left: 0px;
width: 125px;
height: 100%;
border: 1px solid #ff0000;
}
#content {
top: 0px;
margin-left: 126px;
margin-right: 201px;
min-height: 100%;
height: 100%;
border: 1px solid #ff0000;
}
#nav_closed {
position: absolute;
top: 0px;
right: 0px;
width: 200px;
height: 100%;
border: 1px solid #ff0000;
}
#content_header {
border: 1px solid #ff0000;
}
#content_body {
border: 1px solid #ff0000;
}
#content_footer {
height: 15px;
background: #df781c;
border: 1px solid #ff0000;
}
<div id="wrapper">
<div id="nav_open">
nav_open
</div>
<div id="content">
<div id="content_header">
content_header
</div>
<div id="content_body">
content_body
</div>
<div id="content_footer">
Footer
</div>
</div>
<div id="nav_closed">
nav_closed
</div>
</div>
答案 0 :(得分:0)
<强> html的:强>
<div id="wrapper">
<div id="nav_open">
nav_open
</div>
<div id="content">
<div id="content_header">
content_header
</div>
<div id="content_body">
content_body
</div>
<div id="nav_closed">
nav_closed
</div>
</div>
<div style="clear:both;"> </div>
<div id="content_footer">
Footer
</div>
</div>
<强> CSS:强>
html, body { margin: 0px;
padding: 0px;
height: 100%;
width: 100%;
border: none;
}
#wrapper { position: relative;
width: 100%;
min-width: 940px;
min-height: 100%;
height: 100%;
border: 1px solid #ff0000;
}
#nav_open { position: absolute;
top: 0px;
left: 0px;
width: 125px;
height: 100%;
border: 1px solid #ff0000;
}
#content { top: 0px;
margin-left: 126px;
margin-right: 201px;
min-height: 100%;
height: 100%;
border: 1px solid #ff0000;
}
#nav_closed { position: absolute;
top: 0px;
right: 0px;
width: 200px;
height: 100%;
border: 1px solid #ff0000;
}
#content_header { border: 1px solid #ff0000;
}
#content_body { border: 1px solid #ff0000;
}
#content_footer { height: 15px;
background: #df781c;
border: 1px solid #ff0000;
text-align:center;
line-height:15px;
}