Question

这是我遇到的问题：

http://i.imgur.com/KvgT3bA.png（由于没有代表而无法直接发布）

我已经设法让我的包装器（整体边框）随着这个页面上的大量单词扩展，但现在我的页脚已经变得非常奇怪了。

以下是我的HTML＆amp; CSS：

http://pastebin.com/rb7ftatN（由于没有代表在一个链接中）

请帮助我。我是HTML / CSS的新手，我是一个完美主义者，所以当事情不起作用时，我真的很紧张，我相信你们中的一些人可以联系。

非常感谢你！

Answer 1

假设您希望页脚位于文本下方，请使用clear: both;

在你的情况下：

footer {
    /* THIS IS THE MISPLACED FOOTER */
    width: 980px;
    height: 40px;
    /* Other Rules*/

    clear: both;

}

以下是展示它的fiddle。

Answer 2

假设您始终希望页脚可见，请使用固定位置...

.footer {
    position: fixed;
    bottom: 0px;
    /* Other rules */
}

这会将页脚粘贴到屏幕上

Answer 3

我认为只是一个内联块可能会这样做，如

footer {
    display: inline-block;
    width: 980px;
    height: 40px;
    margin-top: 44px;
    position: relative;
    right: 2px;
    border: 2px solid;
    border-color: #000000;
}

由于内容很多，错位的页脚

3 个答案: