Remove textarea inner shadow on Mobile Safari (iPhone)

Question

Hi,

By default, it seems Mobile Safari adds the top inner shadow to all input fields, including textarea. Is there a way to remove it?

It's especially ugly when you have a white background.

Thanks!

Answer 1

By adding this css style:

-webkit-appearance: none;

Answer 2

setting either background and border css properties of the input tag also seems to work.

Try this:

<style>
input {
    background: #ccc;
    border: none;
}
</style>

<form>
First name: <input type="text"/><br />
Last name: <input type="text" />
</form>