HTMLでテキスト、コンボボックス、ボタン等の縦位置を揃える方法

HTMLでテキスト入力欄やコンボボックス、ボタン等を横に並べてレイアウトした際に、それぞれの項目の高さが異なることで、縦位置が揃っていないように見えることがある。各項目の縦サイズを変更したり、marginやpaddingで上下位置を調整しようとしても、反映されなかったりして、なかなかうまくいかない。そもそも、縦位置を揃える必要があるのかということはある。普通はウェブブラウザが配置しているものを任せておけばいい。変に細かい調整を入れると、後々のメンテナンス性が悪くなる。後で見た他の人はどこをどう変えるとどなるのか、把握するのが困難になる。何もせず、ウェブブラウザがするように任せておくのが、一番いい。
とはいえ、それでも縦位置を揃えたいという場合には、float:leftを使う方法がある。すべての項目を左上に詰めていくことで、上端を揃えることができる。ラベル項目はspanで囲めばよい。その後は各項目にpadding-top等を入れて微調整することができる。