My website renders well on the iPhone/Safari browser, with one exception: My text input fields have a weird rounded style which doesn't look good at all with the rest of my website.
Is there a way to instruct Safari (via CSS or metadata) not to round the input fields and render them rectangular as intended?
Best Answer
On iOS 5 and later:
If you must only remove the rounded corners on iOS or otherwise for some reason cannot normalize rounded corners across platforms, use
input { -webkit-border-radius: 0; }
property instead, which is still supported. Of course do note that Apple can choose to drop support for the prefixed property at any time, but considering their other platform-specific CSS features chances are they'll keep it around.On legacy versions you had to set
-webkit-appearance: none
instead: