0

I want my footer to stick to the bottom of the page, so when the page is smaller than the screen, the footer should be on the bottom anyways. But it should not conflict with margin in the css file. So it should not mess up the page when I use margin for some stuff.

4

4 回答 4

2

您只需wrapper div要从那里创建并退出页脚。然后在这个包装器中使 margin-bottom 等于页脚高度并创建一些pushdiv - 它将放置页脚。看看这个：http: //jsfiddle.net/PXYSk/4/

于 2013-10-27T16:44:54.860 回答
1

尝试使用固定位置和 css3calc()函数：

JSFiddle

于 2013-10-27T15:23:13.207 回答
0

只需将页脚设置为position: absoluteand bottom: 0。

于 2013-10-27T15:23:15.950 回答
0

这是如何创建粘性页脚的一个很好的示例，但是您需要固定页脚块的高度：

CSS：

* {
margin: 0;
}
html, body {
height: 100%;
}
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -50px;
}
.footer, .push {
height: 50px;
}

HTML：

<html>
<head>
    <link rel="stylesheet" href="layout.css" ... />
</head>
<body>
    <div class="wrapper">
        <p>Your website content here.</p>
        <div class="push"></div>
    </div>
    <div class="footer">
        <p>Copyright (c) 2008</p>
    </div>
</body>

于 2013-10-27T19:51:33.617 回答