Change colour sizwe menu bar Adele theme

  • Unknown's avatar
    unachicayeye · Member ·

    Hello,

    I’m trying to change the nav menu colour plus trying to increase its size (length) to the whole page width (left+right without blank, does this make sense?). I’ve got the css upgrade but can’t find any useful code. Anyone can help pls?

    The blog I need help with is unachicayeye.worpress.com

    Thanks

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

  • Unknown's avatar
    thesacredpath · Member ·

    If you are talking about the background color of the nav menu (currently black) this will do it for you.

    .navigation-main:before, .navigation-main:after {
    border-color: #CC0000;
}

.navigation-main, .navigation-main ul ul, .menu-toggle, .main-small-navigation ul.nav-menu.toggled-on {
    background: #cc0000;
}

    If you are talking about the menu text colors, this is what you want. The second bit is the “current page” menu item. The first is the non-current page items.

    .navigation-main a {
    color: #55dd00;
}
.navigation-main li.current_page_item a, .navigation-main li.current-menu-item a {
    color: #0055dd;
}

    For the menu, I would suggest centering the menu items rather than trying to space them out across the full width since the theme you are using is a responsive width theme (adjusts for different screen sizes). Add the following to your CSS and then narrow down your browser window. Once the menu goes to two lines, it will again left-align, but the menu items will be centered when the site is at full-width. 

    #site-navigation {
text-align:center;
}

@media screen and (min-width:601px) {
  #site-navigation .menu {
    display: inline-flex;
    margin-left:0;
  }
}
  • Unknown's avatar
    unachicayeye · Member ·

    Thanks very much!

  • The topic ‘Change colour sizwe menu bar Adele theme’ is closed to new replies.