How to change background color in CSS?

Question

My contact form has fields (class="text") and I'm trying to make the usual white background color change to a different color when someone clicks inside it (to type). The CSS codes I'm using is below, and it works great in Firefox, but it doesn't in IE6. I can't seem to figure out why !!!! Is there another way I should be doing this in CSS?

input.text {
BACKGROUND: #ffffff;
}
input.text:focus, textarea:focus {
background-color: #f8f8f8;
}

*Update*

I have tried changing both to "background", "background-color", and even "color" in the css file. I've removed all capitilization as well. I've also tried changing the class and css to:

.field {
background: #ffffff;
}
.field:focus {
background: #f8f8f8;
}

The problem seems to be that IE can't understand the focus part of the CSS, while FF has no problem doing so. There must be an alternative to this for it to work in both though?

Answer 1

The reason why it doesn't work is pretty simple: IE6 doesn't support the pseudo class ":focus" on any element other than "a" (anchor).

That's why all of us, web designer/developer, hate MSIE so much ;)

A solution is to use the "onfocus" javascript event to simulate the same effect.

Answer 2

That looks like valid CSS. Maybe IE6 doesn't like capitalization? Lower case is the usual practice. If that doesn't work, try using "background-color" in both places.

Answer 3

Have you tried using just color: #f8f8f8 instead of background-color? I'm not sure if that will work, but it's worth a try.

Answer 4

HI, try changing "background-color" to smply "background" and see what it does. Different browsers just respond differently to codes sometimes. Hope this helps.

Answer 5

history colour changing via CSS: the main worry-unfastened and essayist thank you to alter the history colour via CSS is to apply this characteristic physique { history-colour:rgb(25,40 5,sixty two); }