html - 为什么我的页脚不在页面底部？

Question

由于某些奇怪的原因，我的页脚显示在我页面内容的后面，不再是正确的高度，我似乎无法修复它。我尝试了其他答案，但都没有用。这个可以查看here.有人有什么想法吗？

.reviewwidget {
	width: 45%;
	margin-bottom: 25px;
	float: left;
}

.reviews {
	width: 55%;
	float:right;
}

.single-review {
	position: relative;
	width:55%;
	float:right;
}

.quotation {
   position: relative; 
   width: 50px; 
   z-index:500;
}

.quotationend {
   position: relative; 
   float:right;
   width: 50px; 
   z-index:400;
   margin-top:-10px;
}

.single-review p {
  position: relative; 
  z-index: 550;
  margin-top: -20px;
  font-size:16px;
  font-style: italic;
}

Footer {
    background-color: #0b1b23;
	color: #ececec;
	padding: 5%;
	font-family: centrale_sans_regularregular, helvetica;
	position:relative;
}

Answer 1

您的 #container 元素有 float 内容，未清除，导致 #container 的高度塌陷。您应该阅读 floating 和 clearfix，但这里有两个解决方案 from this thread :

要添加到 #container 元素的可重用 clearfix 类(推荐):

.clearfix:after { 
   content: " ";
   display: block; 
   height: 0; 
   clear: both;
}

快速而肮脏:

#container { overflow: auto; }