How to center a navigation bar with CSS or HTML

Question

I am having difficulty with centering the navigation bar on this page   I tried nav   margin  0 auto    and a bunch of other ways  but I still can t center it

User · Answer

Your nav div is actually centered correctly  But the ul inside is not  Give the ul a specific width and center that as well

User · Answer

You could also use float and inline-block to center your nav like the following   nav li      float  left    nav      display  inline-block

User · Answer

nav ul       display  inline-block      list-style-type  none      It should work  I tested it in your site

User · Answer

Add some CSS   div nav    text-align  center    div nav ul    display  inline-block

User · Answer

The best way to fix it I have looked for the code or trick how to center nav menu and found the real solutions it works for all browsers and for my friends     Here is how I have done   body       margin  0      padding  0     div maincontainer       margin  0 auto      width     px      text-align  center     ul       margin  0      padding  0     ul li       margin-left  auto      margin-right  auto      and do not forget to set doctype html5

User · Answer

If you have your navigation  lt ul gt  with class  nav Then you need to put that  lt ul gt  item within a div container   Make your div container the 100  width  and set the text-align  element to center in the div container   Then in your  lt ul gt  set that class to have 3 particular elements  text-align center  position  relative  and display  inline-block   that should center it

[html] How to center a navigation bar with CSS or HTML?

Examples related to html

Examples related to css

Examples related to nav

Examples related to centering