1

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

Shaun
  • 2,043
  • 3
  • 27
  • 36
  • 3
    Depending on the browser, Chrome presumably, it's likely you're seeing the 'auto-complete' functionality that is making the input background yellow. In which case you'll need to turn off the setting in order for the yellow background to stop appearing on focus. – sbeliv01 Aug 29 '14 at 15:54
  • possible duplicate of [Removing input background colour for Chrome autocomplete?](http://stackoverflow.com/questions/2781549/removing-input-background-colour-for-chrome-autocomplete) – amphetamachine Aug 29 '14 at 16:01

2 Answers2

3

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?

Community
  • 1
  • 1
  • Thanks guys, but neither solution worked. It's happening in all browsers too, IE included. I don't think this it's autocomplete that's doing it in this case, as the form isn't auto-completing. – Shaun Aug 30 '14 at 02:24
0

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;
}
Covenant T. Junior
  • 1
  • 2
  • 1
    Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Dec 09 '21 at 16:28