The Support Forums will be in read-only mode for a scheduled maintenance window on 01 September 2016 14:00 UTC - 20:00 UTC. More information.

Menu Background CSS (6 posts)

  1. Aaron
    Posted 4 years ago #

    This one is really beating me up.


    I want to change the color pink on About Us and I am getting nowhere trying to do it. I can't even find where it is getting this color from.

    Any help would be lovely!

  2. Michael
    Forum Moderator
    Posted 4 years ago #

    the background color seems to be coming from styles that are embedded into the head section of the site; possibly from some theme options or plugin (?)

    as this is a commercial theme, please contact the theme's seller for support with your question.

    or try to work with Firebug http://getfirebug.com/ or a similar tool to get closer to the source of these styles.

    the embedded styles are alerady using !important;
    #mainnav .current-menu-item > a, #mainnav .sf-menu .current-menu-parent > a{ background-color: #DA0033 !important;}

    therefore, the next will be near impossible:
    [end edit]

    as a last resort, consider to use !important with your styles to force your edits.

  3. WPyogi
    Forum Moderator
    Posted 4 years ago #

    line 101 of internal CSS -- view source says it's "custom CSS"

    #mainnav .current-menu-item > a, #mainnav .sf-menu .current-menu-parent > a {
        background-color: #DA0033 !important;
  4. Aaron
    Posted 4 years ago #

    Thanks WPyogi

    I forget sometimes not to just use firebug and have to actually view source. :)

  5. Aaron
    Posted 4 years ago #


    Problem is this theme is calling this CSS somewhere. Looking at the theme options and header.php I dont see where it is calling it. Big issue is that it is being loaded last so I can overwrite the !important

    I would think it is using a hook but cant find it in functions.php either.

    Guess Ill need to find the person who was working the site before me and asking them how they did these edits.


  6. Michael
    Forum Moderator
    Posted 4 years ago #

    try to create an 'extreme-selective' css style;

    this example seems to be working from within style.css:

    #mainnav #menu-home-page-menu li.current-menu-item > a { background: green!important; }
    #mainnav #menu-home-page-menu li.current-menu-item > a:hover { background: orange!important; }

    obviously, you need to consider all possible pseudo styles, and parent and ancestor items...

Topic Closed

This topic has been closed to new replies.

About this Topic


No tags yet.