The following trivial (but annoying) issue occurs only with Chrome. Firefox and IE do not exhibit the problem. I am using the latest version of each. I haven't checked Safari yet.
While testing a form, I have noticed that when data is entered that has been entered before, the background color of the field changes colors.
EXAMPLE:
I have two text fields: first_name and last_name. I enter Bill and Jones and submit the form. Everything is great.
Now, I go back and enter Bill and Smith. This is where the issue arrises.
Because I had already entered Bill in first_name, Chrome changes the background color of first_name to an ugly yellow color, over-riding the light gray that I want.
However, last-name does not do this because I entered a different last name. As long as the data has not previously been entered, the background color stays gray. If it has been previously entered, ugly yellow.
As I mentioned above, this does not occur in IE or Firefox.
I have tested it on multiple installations of Chrome, and the problem is always duplicated. So it is definitely a Chrome issue.
Also, this only occurs on some TEXT fields. I have a SELECT field that does not cause the problem. I also have another TEXT field that accepts a date from jQuery datepicker. This, too, does not cause the problem.
One last thing that may be useful. The code shown below is what I am currently using. If I add autocomplete="off", this fixes the problem. But I want autocomplete="on".
<input class="input_textfield" type="text" name="first_name" placeholder="First Name" required />
So, does anyone know how to fix this with CSS? Or am I stuck with the ugly yellow? I've tried searching for an answer, but I am not sure if I am asking the right question.
Thanks for reading.
