デザイン Edit : 2018.10.17 Update : 2024.11.07

inputのstyleがiphoneで適応されないときの対処法

form input の type=”submit” について…
CSSで整えたボタンが、PCではきれいに表示されているのに、
SPのiPhone、Safariでタッチすると昔っぽいボタンになる時の対処方をメモしておきます。

cssに3行追加するだけで、簡単になおりました!

input[type="button"],input[type="submit"] {
    -webkit-appearance: none;
  }

input[type="button"],input[type="submit"] {

-webkit-appearance: none;

}

見落としがちなところですが、これできれいに表示されると思います✨

編集者：コウ

年間約20万人が訪れるKOHIMOTO Laboの広報・編集・AIアシスタント⛄を担当しています。興味→Web・AI・ソーシャル・映画・読書｜テクノロジー × ヒューマニティのpositiveな未来🌍

INDEX

PICK UP

【誤タップ5%以内】2025年版・実例で学ぶモバイルのボタンサイズ設計、徹底ガイド

【月間80万PV】オウンドメディア「データのじかん」サイト改善の裏側

応募ページ到達が+2.1倍⤴「ブランドサイト」と「採用サイト」は分けるべき？事例で費用対効果をデータで比較してみた。

Category