How to prevent Firefox from putting shadows around input boxes which have had their background colour changed?

I'm creating a set of input fields and using javascript's .style.backgroundColor = "red" to change the colour of any invalid fields.

In Chrome, there is no 开发者_开发百科problem. However, in Firefox, as soon as I touch the backgroundColor (even if I set it to white) then I get these strange shadow effects.

Does anyone know what's going on?

before: http://imgur.com/xYRLT.png after: http://imgur.com/R1tdI.png

---

Set the border to a single color: style="border:1px solid #000;"