いつもお世話になります。
タイトルどおりなのですが、現在select_tagとnumber_fieldを用意しcssを以下のように書いているのですが、画像のように表示位置がずれてしまいます。
select_tagの文字の開始位置をnumber_fieldと同じ位置にするようにcssで指定するにはどのようにすればよろしいのでしょうか。
ご教示いただければと思います。
よろしくお願いいたします。
追記
申し訳ございません。ブラウザ依存のようで、firefoxでのみこの症状が起きるようです。こういった場合firefoxのみを修正するような方法はあるのでしょうか。
よろしくお願いいたします。
# rails view側 <dl class="select_box"> <%= select_tag 'note[point]', options_for_select((5..20).to_a, selected: @user.xxxxx.to_i) %> </dl> <dl class="text_box"> <%= f.number_field(:yyyy, value: @user.yyyy, id: "yyyy", in: 0..20, step: 1) %> </dl> # css .form_area form .select_box { width: 100px; height: 30px; background: #fff; border-radius: 0px; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url(/xxxx.svg) 82px 50% no-repeat; background-size: 10px; } .form_area form .text_box { height: 28px; width: 100px; }
あなたの回答
tips
プレビュー