gpt4 book ai didi

css 最小高度中心列

转载 作者:行者123 更新时间:2023-11-28 18:52:07 26 4
gpt4 key购买 nike

我需要帮助来修复下一个布局,因为:

  • 它看起来不适合 IE
  • 当#columns 内容变大时,页脚不会停留在底部
  • 我需要使 #column 容器的最小高度为 100%,内容较少

提前致谢!

这是我的代码:

<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>

最佳答案

试试这个(已编辑):
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 最小高度中心列,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8974086/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com