インプットボタンのサイズを確認する
-
課題
-
同じバージョンの同じブラウザ(chrome)でもパソコンによって表示の大きさが違う現象が起きた。
-
原因を調べて対応を検討する。
-
結果
-
inputのボタンタグで大きさが違ってくる
-
高さを設定する。指定しないとボタンに表示される文字列のフォントによって微妙に高さが変わる
-
フォントファミリーを設定する。指定しないとブラウザのデフォルトフォントが使われ、それが違うと微妙に表示位置が変わる
-
フォントサイズを設定する。指定しないと文字の表示位置が変わる
-
他の要素と改行幅を一致させるにはline-heightを設定する。
-
具体的な記述方法はこのページのソースを参照。
-
状態