PCのChromeF12のシミュレーターでは分からず、実機iPhoneSEで見ると、ボタンが灰色グラデーションになってしまう現象がありました。

inputでなく、button要素を使えば問題なさそうです。

現象

iOS（iPhoneSE）上では、こんなボタンになってしまいます。

実際にはこう見せたいわけです。PCのChromeでは問題なく見えています。

対応

【フォーム】iOSのボタンが角丸グラデーションになるのをリセット

こちらの記事が参考になりました。ありがとうございます。

<button type="button">次へ</button>

みたいな感じですね。

input要素を使っていたので、button要素を使うことで回避しました。

おわりに

Chromeのシミュレーターでは限界があるんだよなあということを痛感します。とはいえ、実機でテストも手間がかかりますし、なかなか難しいところですね。

筆者プロフィール

シゴトクリエイター

「シゴクリ」運営者。アイデアの力でお客様に貢献するゼロイチ大好きアイデアマン。ビジネスアイデア採択実績数は474件。好きな言葉は三方良し。詳しい自己紹介、仕事実績も合わせてご覧ください。お仕事メニューやお問い合わせはお気軽にどうぞ。

最新の投稿

• 思考・考え方・メモ2026年2月25日良い文章に会い、良い音楽に会い、良い人に会い、良いに出合えることで自分が作られている
• アイデアネタ2026年1月30日ガソリンスタンドだけでは厳しい中、馬の服洗濯などのアイデアが面白い
• お知らせ2026年1月30日違和感面白トレーニングリリースのお知らせ
• アイデアネタ2026年1月29日ファンがつくる二次創作ゲームを支援する切り口が面白い

ビジネスアイデア相談窓口

ビジネスアイデアに関する、アイデアや企画、事業、起業についてカジュアルなご相談はお気軽に壁打ち可能です。

詳細はアイデア相談窓口（お仕事依頼）をご参照ください。

大橋に相談してみる