Centering a css dropdown menu

Question

I\'m trying to center my css dropdown menu, but I can\'t seen to get it to work! I\'ve tried adding text-align: center and margin-left: auto; margin-right: auto, but all tha

Answer 1

Since you are using float, the only way to center it is to apply a width to the containing element and use margin-left: auto; margin-right: auto. There is no way to do this will retaining the flexible width.

An alternative to float would be display:inline-block; These can be centered using text-align:center, but you'll have to rework the css.

Answer 2

Well, here's one way to do it, you can put a div container around the menu...

#menuContainer{margin: auto;}

<div id='menuContainer' style="width: 980px">