Centre Menu Bar in Baskerville Theme

  • sueperillo · Member ·

    I have tried to centre the menu bar in my baskerville site and even WP support couldn’t tell me how to. Can anyone give me the code to add to the “inspect element” section?

    The blog I need help with is: (visible only to logged in users)

  • thesacredpath · Member ·

    Hi there, on Baskerville, the fact that the search is also in the navigation div means things sort of blow up when we try and center the menu items, so what we are going to have to do is to limit the centering of the menu to 1001px and wider screens so that it doesn’t break the touch menu that activates at 1000px and narrower. 

    @media screen and (min-width: 1001px) {
	.main-navigation {
    text-align: center;
}
.main-navigation ul {
    display: inline-block;
}
.search-icon {
    top: -70px;
}
}
.nav-toggle::before {
	color: #555
}

    The last rule you see above changes the color of the menu icon for the touch menu to a darker grey so that it shows up. For a bit there, I couldn’t find it against your light colored image.

  • sueperillo · Member ·

    I copied that code into the CSS but it didn’t update.

  • thesacredpath · Member ·

    Hi, when I pasted the code above directly into your Customizer, the menu centers and everything looks fine. Can you try pasting it in again at the bottom below all the other code you have in your custom CSS?

  • The topic ‘Centre Menu Bar in Baskerville Theme’ is closed to new replies.