Question

我需要帮助来修复下一个布局，因为：

它看起来不适合IE
当#columns内容增长时，页脚不会停留在底部
我需要将#column容器设为100％min-height with small content

提前致谢！

这是我的代码：

<style>
* {
 margin: 0;
 padding: 0;
 }

 body, html {
  background: silver;
  height: 100%;
 }

 #header {      
  min-width: 1000px;
  width: 100%;
  height: 40px;
  background: red;
 }

 #columns {
  width: 1000px;
  background: white; 
  margin: 0 auto;  
  padding-bottom: 40px; 
  border: 1px solid black;     
 }

 #footer {
  position: absolute;
  bottom: 0;
  min-width: 1000px;
  width: 100%;
  height: 40px;
  background: black;
 }

<body>
  <div id="header"></div>
  <div id="columns"></div>
  <div id="footer"></div>  
</body>

Answer 1

试试这个（已编辑）：
JSFiddle：http://jsfiddle.net/NeCc3/14/

 * {
 margin: 0;
 padding: 0;
 }

 body, html {
  background: silver;
  height:100%
 }

 #header {      
  width: 100%;
  height: 40px;
  background: red;
 }

 #columns{
  min-height:100%;
  width: 1000px;
  background: white; 
  margin: 0 auto;  
  padding-bottom: 40px; 
  border: 1px solid black;     
 }

 #footer {
  width: 100%;
  height: 40px;
  background: black;
 }

css最小高度中心列

1 个答案: