html - 页脚出现在内容后面而不是页面底部

标签 html css alignment

标题不言自明,

我希望页脚位于页面底部,但它出现在内容后面。

您可以在此处查看问题:http://inelmo.com (我将页脚设为黑色以便您可以看到)

HTML

<body>
<div id="header"></div>
   <div id="wrapper">
      <div id="content"> !There is php stuff echoed here! </div>
      <div id="sidebar"></div>
      <div id="footer"></div>
   </div>
</body>

CSS

#wrapper {
    width: 902px;
    margin: 70px auto 0 auto;
}

#content {
    width: 520px;
    padding: 15px;
    float: left;
}

#footer {
    background: #000;
    height: 200px;
}

/* Sidebar */
#sidebar {
    width: 336px;
    float: right;
    padding: 16px 0 0 0;
}

最佳答案

clear: both; 添加到页脚的样式定义中

#footer {
    background: #000;
    height: 200px;
    clear: both;
}

关于html - 页脚出现在内容后面而不是页面底部,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8703374/

相关文章:

javascript - 仅加载部分段落文本的 div

html - 如何通过在地址栏中输入一些 HTML 来显示它?

css - 如何使背景叠加图像完全重复 CSS?

c# - 将 Outlook htmlbody 从右向左对齐

javascript - HTML5 session 存储有多大?

html - block 引用引用样式

html - 如何垂直对齐当前使用列中的 bootstrap 4 类 img-fluid 的图像?

html - 如何在垂直和水平方向上将每个 <div> 中的每个文本元素居中,以便文本恰好位于中间

html - Div 没有彼此对齐

jquery - 使用 setInterval 到另一个 Setinterval