Tuesday, April 3, 2012

Remove textarea inner shadow on Mobile Safari (iPhone)


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!

Post by On
Tags , , ,

2 comments:

  1. UserApril 3, 2012 at 12:25 AM

    By adding this css style:

    -webkit-appearance: none;

    ReplyDelete
  2. UserApril 3, 2012 at 12:25 AM

    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>

    ReplyDelete

Subscribe to: Post Comments (Atom)