Question

Although this seems like a simple task, I need to change the background color of an GOogle Custom Search input field. You can view the page here

Currently, the input field is white, and I need to change it to #4e4e4e. The problem is that I cannot seem to find the correct CSS selector to set the background color. It looks like the google script overrides the css. I need a hack to re-color the background image. Maybe a quick jquery line will fix it, but its not working for me: I tried using the addClass function but it didnt work.

Any Ideas?!

Answer 1

if this doesn’t work

input.gsc-input { background-color: #4E4E4E !important; }

then this should work.

$(function() {
    $('.gsc-input').css('background-color', '#4E4E4E');
}

I didn’t check, but if google has js modifying the styles, then you just need to make sure the jquery script runs last.