how to change tab colors and highlight selected tab

  • Unknown's avatar
    brianjdaily · Member ·

    My name is Brian. I work in health care, and I know nothing about blogs or CSS. I created a .com WordPress blog last weekend here: http://briandailyabroad.wordpress.com/

    My theme is twenty ten. I paid $30 for a WordPress upgrade to be able to make changes to the CSS code. In the menu, I would like to make all the tabs white with black text. And I would like the tab for the selected page to be sky blue with black text, so the viewer can tell which tab is selected. I have looked at two related threads in this forum:
    1) <a href=”My name is Brian. I work in health care, and I know nothing about blogs or CSS. I created a .com WordPress blog last weekend here: http://briandailyabroad.wordpress.com/ I’m not sure which version of WordPress I’m using, and I don’t see the version indicated anywhere in my Dashboard. My theme is twenty ten. I paid $30 for a WordPress upgrade to be able to make changes to the CSS code. In the menu, I would like to make all the tabs white with black text. And I would like the tab for the selected page to be black with white text, so the viewer can tell which tab is selected. I have looked at two related threads in this forum: 1) https://en.forums.wordpress.com/topic/custom-menu-tab-colors-in-twenty-ten?replies=15 2) http://wordpress.org/support/topic/twenty-ten-colour-tabs?replies=6 However, after 3 hours of trial and error, I can’t figure out how to type the CSS code to make it work for me. Which doesn’t surprise me, because I don’t know anything about blogs or CSS code. Please type out exactly what the code should look like, because I plan on copying and pasting your code into my dashboard, then clicking preview, then keeping it if it works. If I’m asking something that can’t be done, please let me know and I will ask WordPress for a $30 refund and settle for what I have now. Thank you for your help and for your patience. Brian My code: #access ul li.current_page_item > a, #access ul li.current_page_parent > a, #access ul li.current-menu-ancestor > a, #access ul li.current-menu-item > a, #access ul li.current-menu-parent > a { color: #fff; } * html #access ul li.current_page_item a, * html #access ul li.current_page_parent a, * html #access ul li.current-menu-ancestor a, * html #access ul li.current-menu-item a, * html #access ul li.current-menu-parent a, * html #access ul li a:hover { color: #fff; }“>https://en.forums.wordpress.com/topic/custom-menu-tab-colors-in-twenty-ten?replies=15
    2) <a href=”My name is Brian. I work in health care, and I know nothing about blogs or CSS. I created a .com WordPress blog last weekend here: http://briandailyabroad.wordpress.com/ I’m not sure which version of WordPress I’m using, and I don’t see the version indicated anywhere in my Dashboard. My theme is twenty ten. I paid $30 for a WordPress upgrade to be able to make changes to the CSS code. In the menu, I would like to make all the tabs white with black text. And I would like the tab for the selected page to be black with white text, so the viewer can tell which tab is selected. I have looked at two related threads in this forum: 1) https://en.forums.wordpress.com/topic/custom-menu-tab-colors-in-twenty-ten?replies=15 2) http://wordpress.org/support/topic/twenty-ten-colour-tabs?replies=6 However, after 3 hours of trial and error, I can’t figure out how to type the CSS code to make it work for me. Which doesn’t surprise me, because I don’t know anything about blogs or CSS code. Please type out exactly what the code should look like, because I plan on copying and pasting your code into my dashboard, then clicking preview, then keeping it if it works. If I’m asking something that can’t be done, please let me know and I will ask WordPress for a $30 refund and settle for what I have now. Thank you for your help and for your patience. Brian My code: #access ul li.current_page_item > a, #access ul li.current_page_parent > a, #access ul li.current-menu-ancestor > a, #access ul li.current-menu-item > a, #access ul li.current-menu-parent > a { color: #fff; } * html #access ul li.current_page_item a, * html #access ul li.current_page_parent a, * html #access ul li.current-menu-ancestor a, * html #access ul li.current-menu-item a, * html #access ul li.current-menu-parent a, * html #access ul li a:hover { color: #fff; }“>http://wordpress.org/support/topic/twenty-ten-colour-tabs?replies=6

    However, after 3 hours of trial and error, I can’t figure out how to type the CSS code to make it work for me. Which doesn’t surprise me, because blogs and CSS are completly new to me.

    My Requests:
    1) Please type out exactly what the code should look like, because I plan on copying and pasting your code into my dashboard, then clicking preview, then keeping it if it works.
    2) Where can I find a “dictionary” of CSS that will explain me, as if I were a sixth grader, what CSS symbols and words mean?

    Thank you very much for your help and for your patience.
    – Brian

    My code: 

    #access ul li.current_page_item > a,
#access ul li.current_page_parent > a,
#access ul li.current-menu-ancestor > a,
#access ul li.current-menu-item > a,
#access ul li.current-menu-parent > a {
color: #fff;
}
* html #access ul li.current_page_item a,
* html #access ul li.current_page_parent a,
* html #access ul li.current-menu-ancestor a,
* html #access ul li.current-menu-item a,
* html #access ul li.current-menu-parent a,
* html #access ul li a:hover {
color: #fff;
}

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

  • Unknown's avatar
    timethief · Member ·

    Hi there,
    I don’t help with CSS editing but Staff do. I have flagged this thread so it will be moved to the CSS Forum for you.

  • Unknown's avatar
    timethief · Member ·

    Staff,
    This is a duplicate thread. Please close it.

  • Unknown's avatar
    brianjdaily · Member ·

    Thanks, I wasn’t sure how to get a duplicate post deleted
    – Brian

  • Unknown's avatar
    timethief · Member ·

    Not to worry. Only Moderators and Staff can delete, close or edit threads on these forums.

  • The topic ‘how to change tab colors and highlight selected tab’ is closed to new replies.