• 0

Code wont change search color


Question

Posted · Report post

I am attempting to remove this blue background color that seems to come up with search by default.  I copied and pasted the styles in custom css yet nothing changes it.  I can change in firebug but I'm trying to enact them live.  I changed the color of the searchform but searchfield will not change.  Any insight on where I can change this would be great.  the code Im using is below

#site .searchform .searchfield{
background: url("http://radiosilentplay.com/redesign/wp-content/themes/dms/images/search-btn@2x.png") no-repeat scroll 4px 50% / 14px 14px #fff !important;
}

but it stays blue.

Share this post


Link to post
Share on other sites

2 answers to this question

  • 0

Posted · Report post

also is there an easy way just to make this a box that has search in it other than this animated stuff?  Im just trying to put a search box on a page.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi,

 

Try this instead:

 

#site .searchform .searchfield {
background: rgba(0, 0, 0, 0) url("http://radiosilentplay.com/redesign/wp-content/themes/dms/images/search-btn@2x.png") no-repeat 4px 50%;
background-size: 14px 14px;
border: none 0;
}

 

The blue is most likely coming from your color options.

 

If you want your search inside a page, you will most likely need to either create a shortcode to display a search anywhere or use a plugin. As to making it look like a standard search box, you simply need to override all the styling or add your own.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now