• Resolved Thedishmaster

    (@thedishmaster)


    I’d like to change the color of my tabs on my blog, and I don’t know how to edit the CSS to do it. I have no idea about coding at all.

    Any help?

    https://www.TheDishmaster.com

    I want to change the tab backround color, along with the color of the font written on the tab.

Viewing 8 replies - 1 through 8 (of 8 total)
  • in your theme’s style.css file you need to find this line of code:

    #header li.current_page_item a

    and change the background color attribute to whatever colour you’d like. at the moment it’s set to #fff which is plain white. this line of css specifies the tab that corresponds to the page your on (php shenanigans will take care of assigning it to the relevant tab)

    hope this works.

    In your style.css look for this code around line 146

    #header li a {
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: none repeat scroll 0 0 #FFFFFF;
    border-color: #F7951E #F7951E -moz-use-text-color;
    border-style: solid solid none;
    border-width: 1px 1px medium;
    color: #84755C;
    display: block;
    float: left;
    margin-right: 2px;
    padding: 8px 14px;
    text-decoration: none;

    }
    Change #FFFFFF in this line to background you want
    background: none repeat scroll 0 0 #FFFFFF;

    Change this line #84755C to the font color you want
    color: #84755C;

    Thread Starter Thedishmaster

    (@thedishmaster)

    That worked but only for one of the tabs

    How do I change it for the other two?

    You mean the code I posted only changed one tab it should change all and then you want to change hover tab its code just below that one one hover and one for current page.

    Thread Starter Thedishmaster

    (@thedishmaster)

    Actually it worked! Do you know how to change the font inside the tab to make it bigger and bold?

    add
    font-weight: bold;
    font-size: 15px;

    add this two line before
    } in the code I posted above #header li a

    Thread Starter Thedishmaster

    (@thedishmaster)

    it worked!!!!! THANK YOU SOOOOOOOO MUCH

    You are welcome

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘How do I change tab colors on my blog?’ is closed to new replies.