Hi, I want to make footer, which is on the bottom of site using position:absolute; and bottom:0; and it does not work
Hello there.
Is there any specific reason you are not using position: relative?
No,but I have been learning css positions and I want to know why it does not work
Ah. Well, here are some excellent resources:
https://www.w3schools.com/css/css_positioning.asp
This one is a nice visual aid.
https://www.w3schools.com/cssref/tryit.asp?filename=trycss_position2
So, it has to do with your workflow:
The visual example does not have the best code, so change the parent3 to use bottom instead of top, and you will see how it is very similar to yours.
Hope this helps
Position absolute uses the nearest “non static” parent element. So it will be absolute from that parent element. Typically you will have a parent div that is position: relative, and then child elements that are position: absolute to keep them positioned within the parent. To position a menu at bottom: 0, use position: fixed. In order to get the centering to work you’ll also have to have a width: 100%. I tweaked your codepen with these fixes here: https://codepen.io/gizmola/pen/BaNXpZe
I guess I left out that the reason it probably didn’t work for you originally is that your footer had no parent that was not static, as the parent of the footer block was the body, which has the default position of “static”.