How to Change Background Color of Title Block 2?


  • Vandna
    Newbie 23 points
    September 22, 2016 at 6:00 pm

    Hi,
    I would like to change the Background Color of Title Block 2.
    Any Help with the custom code?
    Website: https://www.couponsqueen.in/

    Attachments:
    You must be logged in to view attached files.
  • JamesD
    JamesD
    Super Guru 1,516 points
    September 22, 2016 at 8:33 pm

    Hello Vandna,

    Try referencing ‘.home .tabstyle1 .nav-tabs“.
    For example…

    .home .tabstyle1 .nav-tabs {
        background-color: #1b96fe;
    }

    Also, if you wanted to change the color of the ‘Add Listing’ button (and/or text color) you could use something like this:

    .home .tabstyle1 .nav-tabs > li .btn {
        background-color: #FF9900;
        color: #FF9900;
    }

    Where background-color is the color of the background and color is the font color of the referenced element.

    Just change to the color values you need.

    This reply was awarded the best answer by the topic poster.

  • Vandna
    Newbie 23 points
    September 23, 2016 at 2:57 am

    Thank you Mr. James!
    I have changed the color of both tab style as well as add listing button.
    I would also like you to help me with:
    1. changing the hover color of the button “Ending Soon” and “Latest Item”(same as Add Listing)
    2. changing hover color of the top menu?

    Website: https://www.couponsqueen.in/
    Any Help?

  • JamesD
    JamesD
    Super Guru 1,516 points
    September 23, 2016 at 6:08 pm

    Hi Vandna,

    #1) You can try something like this for the tab hover background and font color

    .home .tabstyle1 .nav-tabs > li a:hover {
        background-color: #FF9900;
        color: #FF9900;
    }

    #2) The background color on this one will need to use ‘!important‘ to override the current… like:

    #core_header_navigation .nav > li a:hover {
        background-color: #fff000 !important;
    }

    Note: These are just ways to quickly style, however, there could be other ways of achieving the same within the theme settings. If so, perhaps a member more familiar with the built-in CSS settings can provide some insight.

Viewing 4 posts - 1 through 4 (of 4 total)

New Business Themes for WordPress 2020

Start your new website today!

View Business Themes