Nice browser widgets AND background color, posssible?

Question

I'd like to slightly change the look of some browser widgets (like changing the background color of required fields). But apparently this forces the browser to switch back from 'native'-looking widgets to boring common-look widgets. This is especially bad if you have both unmodified and modified widgets on the same page.

Problem occurs with Firefox on OS X and Ubuuntu.

Any ideas how to get around that 'fallback'-behavior?

Example: https://bounty.schuettel.ch/~reto/so/demo.html

<input type="text" value="123 test" style="background-color: #FFC;"/> 

Thanks Reto

Answer 1

I've noticed that on Firefox as well. I don't think there's any way around it.

In my sites I always set the styling on all my input fields deliberately to trigger this behaviour across the board -- I don't mind that it does that, but I do need all my select boxes to have the same style.

But to be honest I don't really like the "native-looking" select boxes anyway. They tend not to fit very well into a lot of web site designs, so I prefer the standard ones.