Firefox for Android (v18) CSS Reset?

Question

I'm struggling to remove unwanted box shadows and gradients from elements such as including <input type="text">, <textarea>, <select>, and <button> in the latest version of Firefox for Android (v18). The desktop counterpart of Firefox for Ubuntu and Windows does not exhibit the same issue.

Safari on iOS also adds styling to make certain elements appear more native-like, however resetting the unwanted styles was fairly easy thanks to -webkit-appearance: none.

Mozilla's Developer Docs do mention support for -moz-appearance: none, however it does not seem to work as intended on Firefox for Android.

Answer 1

This issue is well documented on bootstrap, removing the background image has worked for me

https://github.com/twbs/bootstrap/issues/8702

background-image: none;