input 소스를 작성해서 보면 아이폰에서 버튼도 그렇고 입력창도 그렇고 기본적으로 효과가 들어가서 원치 않는 모양으로 나올때가 많습니다. 저희 라이믹스 팁 사이트에 뉴스레터 메일 구독 input 을 달아 놓고 아이폰에서 보니 역시나 버튼도 작고 이상한 모양이더군요.

이럴때 

    -webkit-appearance: none;
    -webkit-border-radius: 0;

css에 위 내용을 추가해 주면 되는데요.

아예 input 전체에 적용하거나

input {
   -webkit-appearance: none;
   -webkit-border-radius: 0;
}

아니면 버튼이나 input 각 클래스에 별도로 따로 적용해 줘도 좋구요.

저희는 버튼에만 적용해 봤습니다.