css高度不增长
css高度不增长
提问于 2013-05-11 06:44:20
我有一个网页，分为页眉，页面和页脚。
问题是我把页面做成了height :auto;。但它不工作，我需要的页面自动成长。
这是我在CSS中所拥有的：
/* Page */
#page-wrapper {
overflow: auto;
height: auto;
text-align: center;
}
#page {
overflow: auto;
width: 1120px;
margin: 0px auto;
padding: 50px 40px;
color: #8F8F8F;
min-height:700px;
height:auto;
}和HTML：
<body>
<div id="banner">
<div class="img-border">
<div id="header-wrapper">
<div id="header">
<div id="logo">
</div>
</div>
</div>
</div>
</div>
<div id="wrapper">
<div id="page-wrapper">
<div id="page">
<div id="wide-content">
</div>
</div>
</div>
</div>回答 3
Stack Overflow用户
发布于 2013-05-11 07:11:15
现在还不清楚你想要的是什么。
在第一行中，您说想要一个页脚，但是HTML和CSS没有显示任何页脚。
如果你想要一个固定在页面底部的页脚，可以看看CSS Sticky Footer。
Stack Overflow用户
发布于 2013-05-11 06:53:24
你根本不需要里面的高度...div会随着其内部内容的数量而增大或缩小。尝试完全删除height: auto；。
如果您的意思是，即使没有足够的内容，也要使内容部分达到页面高度的100%，这对Make div 100% height of browser window应该有帮助
Stack Overflow用户
发布于 2013-05-11 07:09:52
你的意思是，你想让页面底部的页脚和中间的div占据剩余的空间(从你的措辞中很难确定)？
如果这就是你想要的，我建议你看看这篇博文：http://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page
HTML摘要：
<div id="container">
<div id="header"></div>
<div id="body"></div>
<div id="footer"></div>
</div>CSS摘要：
html,
body {
margin:0;
padding:0;
height:100%;
}
#container {
min-height:100%;
position:relative;
}
#header {
background:#ff0;
padding:10px;
}
#body {
padding:10px;
padding-bottom:60px; /* Height of the footer */
}
#footer {
position:absolute;
bottom:0;
width:100%;
height:60px; /* Height of the footer */
background:#6cf;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/16491824
复制相关文章
相似问题
腾讯云开发者
