Aligning navigation menu.
URL to the page in question:
http://
-
How do you align a navigation menu to be centered, to the left, or right justified?
Hi Vicky,
You’ll need to add a bit of CSS to alter the header’s layout. In the Advanced section of the Customizer, there is a field for Custom CSS. Here’s what you can add there:
Center Logo & Navigation
@media screen and (min-width: 768px) {
#logo {
float: none;
text-align: center;
}
nav#primary-site-navigation {
float: none;
top: 0;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
#header-menu {
width: 100%;
text-align: center;
}
#header-menu li {
display: inline-block;
float: none;
}
}
Left Side Navigation/Right Hand Logo
@media screen and (min-width: 768px) {
#logo {
float: right;
}
nav#primary-site-navigation {
float: left;
}
}
Enjoy your weekend,
Bill
The CSS works! Thanks, Bill.
- The topic ‘Aligning navigation menu.’ is closed to new replies.