当サイトは通販サイト・外部Webサービスへのリンクの一部にアフィリエイト広告を使用しています。
Webブラウザの広告ブロッカー等により記事中で紹介している商品の現在の価格、通販サイトへのリンク等、一部コンテンツが表示されないことがあります。表示したい場合は広告ブロッカーをオフにしてください。当サイトではプッシュ通知、オーバーレイ広告、全画面広告は導入していません。
Webブラウザの広告ブロッカー等により記事中で紹介している商品の現在の価格、通販サイトへのリンク等、一部コンテンツが表示されないことがあります。表示したい場合は広告ブロッカーをオフにしてください。当サイトではプッシュ通知、オーバーレイ広告、全画面広告は導入していません。
iPhoneのSafariでフォームをタッチした時に画面をズームさせない方法
2013年5月23日
ズームしなくていいのに！そんなときのスタイルシート
レスポンシブレイアウトのサイトをiPhoneから見た時に、サイト内に配置したプルダウンメニューやテキストエリアをタッチすると画面がズームされてしまうのを防ぐ方法メモ。
参考になったのはこちらの記事。
BALLOG：iPhoneでフォームへのフォーカス時に自動ズームしてしまう現象について
リンク先の記事ではinputのfont-sizeを16pxに設定する方法が書かれていたけど、select、textareaも同じ方法で対応できた。
input,select,textarea{
font-size:16px;
}
Mobile Safari絡みのform関連ではこちらの記事も参考になった。Mobile Safariが気を利かせてボタンをデザインしてしまうのを解除する方法。
コリス：[CSS]iPhone(Mobile Safari)でsubmitのテキストがずれた時の対応方法
Mobile Safariによるデザインを解除したいときはスタイルシートに
-webkit-appearance: none;
を追加する。