How to Center Menu in WordPress Using CSS

How to Center Menu in WordPress

by

This article will answer one of our visitor’s questions and show you How to Center Menu in WordPress. It is seen on the left side of the screen by contrast.

Would you like to change your style in your WordPress navigation menu? Although your WordPress theme handles your WordPress menus’ display, you can easily adjust it to your requirement using CSS.

How to Center Menu in WordPress Using CSS

This approach allows users to add customized CSS manually and is designed for intermediate users.

Navigation menus for WordPress are seen on an unordered list (bulleted list).

Usually, you can view a list without any corresponding CSS classes if you use the WordPress menu tag default. Here are the steps you need to follow:

  • Login to your WordPress Dashboard.
  • Now, quickly Navigate to Appearance >> Customize.
How to Center Menu in WordPress Using CSS
  • Finally, add the following code:
.main-navigation ul {
text-align: center;
}

.main-navigation ul li {
display: inline-block;
float: none;
}
  • To save the changes, Click Publish button.

This will surely Center your Menu in WordPress.

Sum Up

Anyways, we hope this detailed guide helped you to understand How to Center Menu in WordPress. And for the visitor who asked us to write an article on How to Make a Menu Item Not Clickable in WordPress. We have a dedicated article on this.

If you enjoyed this post, subscribe to our WordPress video tutorials on YouTube Channel. Remember to follow us on Pinterest.

We accept any type of suggestions from the visitors because it always motivates us to improve. Feel free to comment below.

Leave a Comment