【CSS】チェックボックスとテキストを水平にしたい

css

皆さん、フォームをマークアップするときにこんな経験ありませんか？
フォームのラジオボックスとかチェックボックスなどの要素とそれを表す文字が微妙にずれていてなんかバランス悪いという時。
そんな時は、vertical-alignやpositionを使って水平にする方法があるのでメモしておきます。

フォーム要素のポジションを相対位置にする

formのinput要素のpostionをrelativeに設定してピクセルなどで調整するパターン

input{
  position:relative;
  top:1px;
}

フォーム要素の縦の位置を調整

formのinput要素のvertical-alignをmiddleにするかピクセルなどで調整するパターン

input{
  vertical-align:1px;
}

参考サイトに詳しく書いてある