How to center align the navigation links in a navigation menu?

Center align navigation links can be observed and created easily with a few links of CSS. Mostly the websites with less navigation links and sometimes for the sake of design,it becomes a need to align the navigation links in center. Lets start with a demo.

See the Pen hKdwG by Mohammad Hamza Dhamiya (@hamzadhamiya) on CodePen.

The pen shows the centrally align navigation.It is possible due to the ul tag have align center while if you will make all the li tag display inline-block then they will follow the property of inline and block both because of which they will stay in center.

But if you can see I've used negative (-5px) margin-right in li tag. It is due to the spacing between inline-block makes unwanted gapes,to maintain this I've used negative values.

Read More:Fighting the Space Between Inline Block Elements