safariでセレクトボックスのレイアウトが微妙にずれる
最近はCSSをいじって、サイトのレイアウトを整えることも行っているのですが
IE,FireFoxでは全ての部品が画面の左部分に寄って表示されるところが
safariだとセレクトボックスだけが微妙に左揃えにならない。。。
セレクトボックスだけが数ピクセルほど右側になっているので
画面上の部品が左揃えではなく、インデントがガタガタになって表示されるので
かなり気になる。
と、Safariを開発モードにして調べてみると
どうやら、Safariで表示されるセレクトボックスではデフォルトでmargin:2pxに
なっており、ここが原因っぽい。
Selectタグにmargin-left:0px; を自前で設定すると、事象が解決しました。
今までサイトのレイアウト調整をしたことがなかったので
ブラウザで独自にCSSが当てられるとは知らなかった。。
いい勉強になりました♪
IE,FireFoxでは全ての部品が画面の左部分に寄って表示されるところが
safariだとセレクトボックスだけが微妙に左揃えにならない。。。
セレクトボックスだけが数ピクセルほど右側になっているので
画面上の部品が左揃えではなく、インデントがガタガタになって表示されるので
かなり気になる。
と、Safariを開発モードにして調べてみると
どうやら、Safariで表示されるセレクトボックスではデフォルトでmargin:2pxに
なっており、ここが原因っぽい。
Selectタグにmargin-left:0px; を自前で設定すると、事象が解決しました。
今までサイトのレイアウト調整をしたことがなかったので
ブラウザで独自にCSSが当てられるとは知らなかった。。
いい勉強になりました♪
コメント
コメントを投稿