Adjusting width of drop down in custom menus and changing background color.

  • Author
    Posts
  • #1261018

    Hello!

    I would like to adjust the width of my custom menu drop downs. As you can see several titles become 2 lines because the drop downs are too narrow. Additionally, I would like to change the background color of the drop down menu.

    My blog is:
    nicolephinney.com

    My theme is vigilance with the customization upgrade.

    Thank you!

    The blog I need help with is nicolephinney.com.

    #1261136

    kraftbj
    Staff

    You can make these CSS changes:

    For the menu width, add this to your custom CSS:

    #nav ul ul li {
    min-width: 130px;
    }

    (adjusting the number to where you need it to be. 120px was enough for “Upcoming Events” to no longer break).

    To change the background color of the drop down, and only the drop down, add this:

    #nav .children li, #nav .sub-menu li {
    background: #000;
    }

    Replace #000 with the hex value of the color you’ll like to use.

    As a reminder, here is how to edit the CSS on WordPress.com: http://en.support.wordpress.com/custom-design/editing-css/

    Cheers!

    #1261246

    @nicolephinney, one thing to keep in mind is that browsers all render things a little differently, so it could be that some browsers might still show it as two lines. It also depends on the zoom level and how people have their browsers configured. Some people may set their minimum font size larger than what is normal. In those cases the lines in the sub menus may still show up on two lines.

    #1261251

    timethief
    Member

    offtopic
    @thesacredpath
    We have Hawaiian weather here on the coast. I’m ♥ ing it. :)

    #1261338

    Timethief, congratulations on the weather. It is hot here in Austin. I have to get used to that as it will get even hotter within a month and I’ll be spending a lot of time in the AC comfort of our home. :)

The topic ‘Adjusting width of drop down in custom menus and changing background color.’ is closed to new replies.