Question

I’ve made a menu strip that I would like fixed to the bottom center of the page. I’ve tried everything. Is there a way to do this in CSS? I’ve gotten the menu to be fixed at the bottom of the page with

bottom: 0px
position: fixed

but using

margin: auto auto 0px auto or margin-left: auto

doesn’t seem to center the menu. It’s just stuck to the left side of the page. Any thoughts would be greatly appreciated!

Answer 1

To center an element you need to specify width and set left and right margins to auto.
Then to stick such an element to the bottom of the page you need to wrap it in another element which has fixed width, say 100% and is positioned on the bottom. And yes, css you can.

<section style="position: fixed; bottom: 0px; width: 100%;">
 <p style="margin: 0 auto; width: 300px;">Blah blah</p>
</section>