CODEWITHSUNDEEP
css
Shaun
Shaun

Reputation: 2181

How to stop yellow background on input field focus?

A form I've made turns yellow when you click in it, though I didn't set it yellow. Is this standard?

I've deleted all of the project's css, and the yellow still appears.

So I tried forcing the color like so

#siteSearch.active {
background-color: #fff;
}

I've not come across this before - anyone else encountered it?

Cheers

Upvotes: 1

Views: 5252

Answers (2)

Covenant T. Junior
Covenant T. Junior

Reputation: 66

Try this. If gives a colorless/white background to input fields an to all possible psudeo classes that can throw the error...

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:active,
input:-webkit-autofill:focus {
    background-color: #FFFFFF !important;
    color: #555 !important;
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
    -webkit-text-fill-color: #555555 !important;
}

Upvotes: 0

user3350593
user3350593

Reputation:

It is likely happening in other browsers as well. As Shaun has stated it is likelty due to auto-complete. Safari also highlights input fields yellow (on mobile and desktop). This could be why.

This answer seems to be what you're looking for:

Removing input background colour for Chrome autocomplete?

Upvotes: 3

Related Questions