Centering menu, changing text size in Yoko

  • Author
    Posts
  • #1328789

    jmhanlon8
    Member

    Hi, I’d like to be able to center the menu that’s above my header image and make the text larger or have a background color. I know this should be a fairly simple fix, but the code I’ve seen posted here to do this in other themes isn’t working for my Yoko theme.

    I’m new to CSS so my method has been to “view source” of other Yoko blogs, but I haven’t come across any that have a centered menu.

    Any code/hints would be appreciated!

    The blog I need help with is juliahanlonyoga.com.

    #1329073

    the code I’ve seen posted here to do this in other themes isn’t working for my Yoko theme

    That’s normal. CSS will be different for each theme.

    I’d like to be able to center the menu that’s above my header image

    You can center the main menu on the Yoko theme like this:

    #branding #mainnav {
    	text-align: center;
    	width: 100%;
    	max-width: 100%;
    }
    
    #mainnav ul {
    	display: inline-block;
    }

    make the text larger

    To change the text size and color, first try the options in the Appearance → Themes → Customize → Colors panel.

    I see you’ve also already figured out how to adjust the main menu font size using CSS like this:

    #branding #mainnav ul li a {
    	font-size:1em;
    }

    or have a background color

    To change the main menu background color, add something like this:

    background: #eee;

    To the “#mainnav ul” block from above. Adjust the color code as needed.

    The blog looks great!

    #1329147

    jmhanlon8
    Member

    Thank you! It all worked perfectly.

The topic ‘Centering menu, changing text size in Yoko’ is closed to new replies.