ブログ

トップページ > ブログ記事一覧 > [web]mailformproでラジオボタンのデザインをカスタマイズするときの注意

[web]mailformproでラジオボタンのデザインをカスタマイズするときの注意

  • 投稿日:2020/12/01
  • 最終更新:2020/12/01

多機能ながら無料で使える、シンクグラフィカ和田さん制作の「メールフォームプロ」。便利なのでしばしば利用しています。

さて、この制作に関して、ラジオボタンの標準UIを隠してデザインをカスタマイズする場合の注意点です。

何をしたら問題か

  1. input[type=”radio”]の要素を、display:none で非表示にしたら
  2. 必須項目エラーが発生した場合に対象要素まで正しくスクロールできない

ということが起きます。

別の手段で非表示にする必要あり

visibility: hidden;
width: 0;

こっちのほうがベターかなと。

それだけでした。