如何修复页脚和页面底部？答案

【问题标题】：How do I fix my footer and the bottom of this page?如何修复页脚和页面底部？
【发布时间】：2012-09-22 21:10:21
【问题描述】：

我正在尝试修复一张桌子并让它看起来更好（我在下面的屏幕截图中更好地描述了这个问题）。

这是正在发生的事情和我希望发生的事情的屏幕截图：

我要在我的样式表中更改什么？

css文件位于rankingclimber.com/css/style.css（页脚部分标明），注册部分标明

注册页面位于www.rankingclimber.com/signup.php

这是页脚文件的代码：rankingclimber.com/footer.php，页脚在主页上被调用：rankingclimber.com/signup.php

【问题讨论】：

这里是关于您的页面发生了什么的详细报告：validator.w3.org/…

标签： html css

【解决方案1】：

要固定行的位置，请将<div class="form_bt"></div> 移动到<div class="form_tp"> 的结束标记之后。

要修复“创建帐户”按钮不在表单中，请从 <div class="chkp3"> 中删除 float: left 和 margin-bottom: 20px。然后，在<a class="btn1"> 中添加margin-top: 20px。

要修复页脚，请将<div id="footer"> 移动到<div id="wrapper"> 的结束标记之后。

仅在 Firefox 中使用 Firebug 进行测试。

另一个答案指出您缺少关闭标签。在这种情况下，我的回答可能不是很有用，因为问题可能完全是由那些缺少的标签引起的。

修复缺少的关闭标签，然后在执行我发布的任何步骤之前查看您的页面是什么样的。

【讨论】：

非常感谢。三十点太棒了！

【解决方案2】：

我想，将margin:0; !important 添加到.form_bt 样式中。 Safari Web Inspector 显示它当前的 margin-right 为 -60px。在您的 HTML 中，将 div.form_bt 放在 <form> 元素之外，它目前在其中。

【讨论】：

感谢 Anriëtte！我确保我的 div.form_bt 在表单元素之外。

【解决方案3】：

尝试这些修复，我无法验证，因为我没有您的所有文件，但您缺少以下结束标记：

代码后面缺少</li>：<li><a href="what-is-ranking-climber.php">What is Ranking Climber?</a>&nbsp; &nbsp;
代码前缺少</div>：</form>

【讨论】：

【解决方案4】：

使用这个 CSS

clear: both;

<div id="container">

      <div class="left"></div>
      <div class="right"></div>          

</div>
<div class="footer"></div>

这些 DIV 的 CSS

#container{
  width:950px;
  min-height:500px;  // This will helps you to stick to footer to bottom about 500px below
}
.left{ width: 50%;}
.right { width:50%;}

.footer{
  widht: 950px;
  clear: both; // This will helps you to avoid footer to overlap. Use this when Some      elements is overlapping 
}

【讨论】：