Reply To: Why isn't my footer at the bottom?

[I.m.learning]

@Atelierbram

Let me help you here a minute because you just defined ABSOLUTE, not relative. This is from Chris Coyer, the owner of this website, the link I referenced earlier.

Static. This is the default for every single page element. Different elements don’t have different default values for positioning, they all start out as static. Static doesn’t mean much, it just means that the element will flow into the page as it normally would.

Relative. This type of positioning is probably the most confusing and misused. What it really means is “relative to itself”. If you set position: relative; on an element but no other positioning attributes (top, left, bottom or right), it will no effect on it’s positioning at all, it will be exactly as it would be if you left it as position: static; But if you DO give it some other positioning attribute, say, top: 10px;, it will shift it’s position 10 pixels DOWN from where it would NORMALLY be.

Absolute. This is a very powerful type of positioning that allows you to literally place any page element exactly where you want it. You use the positioning attributes top, left bottom and right to set the location. Remember that these values will be relative to the next parent element with relative (or absolute) positioning. If there is no such parent, it will default all the way back up to the html element itself meaning it will be placed relatively to the page itself.

Fixed. This type of positioning is fairly rare but certainly has its uses. A fixed position element is positioned relative to the viewport, or the browser window itself.

If they place the footer at the bottom of the body, there’s no reason to use any of them because it is the last item to be displayed (static). The issue I saw was too much redundant code. Also, tags were closed off in the wrong place.