What is a sticky footer?

This question is a total noob one, but I can't get the difference betwee开发者_如何学编程n a normal footer and a sticky footer.

Taken from CSS tricks:

The purpose of a sticky footer is that it "sticks" to the bottom of the browser window. But not always, if there is enough content on the page to push the footer lower, it still does that. But if the content on the page is short, a sticky footer will still hang to the bottom of the browser window.

Here is a clear idea of what a Sticky footer is: https://css-tricks.com/couple-takes-sticky-footer/ And http://css-tricks.com/sticky-footer/

And an example: https://getbootstrap.com/docs/4.0/examples/sticky-footer/

From CSS Tricks,

The purpose of a sticky footer is that it "sticks" to the bottom of the browser window. But not always, if there is enough content on the page to push the footer lower, it still does that. But if the content on the page is short, a sticky footer will still hang to the bottom of the browser window.

I would guess a sticky footer is one that stays fixed to the bottom of a page, regardless of the length of content. Like this.

I assume a sticky footer stays at the same place on a screen all the time. In what context?

A sticky footer is anchored to the bottom of the browser view port, as opposed to the bottom of the entire page. It retains its position relative to the bottom of the browser as the page scrolls.

the sticky footer will always remain at a fixed position on the screen no matter you scroll or not.It will be visible all the time at that specific place.

You can zoom out this page : http://maedeh.arianblog.com/ and also http://stackoverflow.com and compare what happens for their footers!

hope it helps!

This CSS sticky footer code pushes a website's footer to the bottom of a browser window. It is valid CSS and HTML with no unsavory hacks, so it works in all of the major browsers (even the now defunct IE5 and IE6).

        How to use the CSS Sticky Footer on your website,

Add the following lines of CSS to your stylesheet. The negative value for the margin in .wrapper is the same number as the height of .footer and .push. The negative margin should always equal to the full height of the footer (including any padding or borders you may add). Follow this HTML structure. No content can be outside of the .wrapper and .footer div tags unless it is absolutely positioned with CSS. There should also be no content inside the .push div as it is a hidden element that "pushes" down the footer so it doesn't overlap anything.