change the color of the search bar

  • Author
    Posts
  • #70691

    cdianneth
    Member
    Original poster

    Howdy from Texas!

    Is it possible to change the color of the search bar?

    The blog I need help with is: diannethornton.com

    #70861

    binarymoon
    Theme Author

    Hello from England :)

    Yes – totally possible to do this using some custom css. The following code should do it.

    #masthead input.searchfield, #masthead input.searchfield:focus, #masthead input.searchfield:hover {
    background:#fff;
    }
    #70862

    binarymoon
    Theme Author

    You can replace the #fff with a colour of your choice from http://www.colorpicker.com/

    #70864

    cdianneth
    Member
    Original poster

    Thanks for this, Brian … I’ve tried several different colors and I’m not seeing a change … right now it’s set to bright red …

    Is the search bar all one color? Is there a border? Wanting to make it “softer” for the softer color scheme I have.

    Thanks again.
    Dianne

    #70865

    binarymoon
    Theme Author

    Perhaps the rule isn’t specific enough. Try this – it should make it work

    body #masthead input.searchfield, body #masthead input.searchfield:focus, body #masthead input.searchfield:hover {
    background:#fff;
    }

    Ben

    #70885

    cdianneth
    Member
    Original poster

    BEN! (not sure where i got brian) …

    That worked great!

    Can I change the color of the text inside?

    #70889

    cdianneth
    Member
    Original poster

    nm … i figured it out!!!

    #70902

    binarymoon
    Theme Author

    :) No worries – you’re actually the second person to call me Brian this weekend.

    Glad you worked out the colours – looks great!

The topic ‘change the color of the search bar’ is closed to new replies.