Support » Themes and Templates » Help with template tabs and css

  • Hi,

    I am using this theme http://www.newsprotheme.com/ and I would really like any of the options in the second horizontal menu (for example, entertainment) to remain gray after clicking and navigating to that page so that users can know what page they are on. This seems like a simple thing to do, but I really can’t figure it out. Any help or suggestions would be much appreciated.

    Thank you very much.

Viewing 4 replies - 1 through 4 (of 4 total)
  • You should just need to add li.current-cat { background: gray; } to your style.css theme file (replacing “gray” with the hex code for the precise color that you’d like to use).

    – Tim

    Hey Tim,

    Thanks for your reply. I tried by couldn’t get it to work. Below is what the style.css section for the menu looks like. I am a bit inexperienced as of present and would really appreciate it if you can tell me where exactly to place that line and also if that line needs to be modified based on the style info below:

    /* *************************************** DROPDOWN NAVIGATION – CATEGORIES */
    #navcats {
    width:970px;
    background: #fff;
    border-bottom:2px solid #006599;
    }
    #navcats #navcatlist li {
    float: left;
    width: auto;
    }
    #navcats ul li a {
    display: block;
    font-size: .9em;
    color: #333;
    padding-top:6px;
    padding-bottom:6px;
    padding-right:12px;
    padding-left:12px;
    border-right:1px solid #ddd;
    }
    #navcats ul li a:hover {
    background: #006599;
    color:#fff;
    }
    #navcatlist li li {
    float: left;
    width: 160px;
    }
    #navcatlist li li a{
    background: #b5dded;
    color:#222;
    float: none;
    padding-top:3px;
    padding-bottom:2px;
    padding-right:12px;
    padding-left:12px;
    border-top: 1px solid #555;
    border-right:0;
    width: 136px!important;
    width:160px;
    width/**/:/**/136px;
    }
    #navcatlist li li a:hover {
    background: #8BC7DF;
    color:#222;
    }
    #navcatlist li ul {
    position: absolute;
    width: 160px;
    left: -999em;
    border-bottom:1px solid #555;
    }
    #navcatlist li:hover ul {
    left: auto;
    display: block;
    }
    #navcatlist li:hover ul {
    left: auto;
    }
    /* ********************************************************** */
    /* CONTENT-WRAPPER */
    /***********************************************************/
    #content-wrap {
    width:970px;
    margin: 0 auto;
    clear:both;
    }

    Thanks a lot!

    Try this: #navcatlist li.current-cat a { background: #006599; }

    – Tim

    Hi Tim,

    You are a lifesaver! That worked well with the addition of:
    #navcatlist li.current-cat a { background: #006599; color: #FFFFFF; }

    Thanks again for you time and help.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Help with template tabs and css’ is closed to new replies.