开发者

Sticky footer with a non-static web page help [duplicate]

开发者 https://www.devze.com 2023-03-18 20:51 出处:网络
This question already has answers here: 开发者_开发问答Closed 11 years ago. Possible Duplicate: CSS sticky footer
This question already has answers here: 开发者_开发问答 Closed 11 years ago.

Possible Duplicate:

CSS sticky footer

My page has content where as users submit content, the page length increases. This is a problem for traditional designs for sticky footers as they tend to stick at the original location and end up just floating in the middle of the page instead.

Does anyone have any tips or tricks to make a sticky footer that will keep it down at the bottom even when the content enlarges the page size?

Thanks in advance.

Credit to AlienWebguy... after looking at the strucutre of my webpage we figured out adding a clear: both to a standard footer CSS fixed it.


EDIT: This is not a true "Sticky Footer" but this is what solved the OP's issue in this instance. For true sticky footer application try this:

Yep you'll want to use this CSS:

#sticky_footer {
    position:relative;
    clear:both;
    bottom:0;
    height:100px;
    width:100%;
}

Used like this:

<body>

...
<div id="sticky_footer"></div>
</body>


I've had great success with this sticky footer implementation: http://ryanfait.com/sticky-footer/

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号