我有问题试图让我的页脚“粘”到页面底部的所有内容下面。我尝试了许多不同的技术,但无法使其与标题一起工作。HTML CSS - 页脚 - 下面的空格
什么是最好的方式来布局我的布局来实现这一目标?
正如你可以看到侧边栏&内容divs通过页脚。
TitleTitle
title
Languages
- 1
- 2
- 3
- 4
- 5
Frameworks
- 1
- 2
Footer
CSS:
html, body
{
width: 100%;
height: 100%;
margin:0;
padding: 0;
}
h1, p {
padding: 0;
margin: 0;
}
/*Content*/
#wrapper{
min-height: 70%;
height: auto;
height: 70%;
margin: 0 auto -400px;
}
#content{
float:left;
width:70%;
height: 100%;
}
#sidebar{
padding-top: 30px;
float:left;
width: 30%;
background-color: lightgrey;
height: 100%;
text-align: center
}
/* Header */
header #title_text{
font-size: 70px;
}
header #title_wrapper{
text-align:center;
position: relative;
top:100px;
}
header {
background-color: orange;
position: relative;
height:30%;
width: 100%;
color:white;
margin:0;
}
/* footer */
footer{
background-color: #202020;
color: white;
position: absolute;
width: 100%;
height: 60px;
bottom: 0;
}
+3
嗨,请做一个谷歌搜索“粘脚” - 有很多不同的方式可以实现 –
+0
看到这个小提琴https://jsfiddle.net/zqmpLenp/ –
+0
检查我的答案为jsfiddle(https: //jsfiddle.net/pdyrgc2j/1/)。删除尾部1 /以查看Declan的原始代码,但位置:绝对更改为position:fixed(https://jsfiddle.net/pdyrgc2j/) –