html - チェックボックスのラベルを縦に揃えますか?

Question

次のようなチェックボックスがあります。

<label class="checkbox-label"><input type="checkbox" value="115">Administrators</label>

しかし、ラベルをチェックボックスの中央に合わせてスタイルする方法がわかりません。

追加してみましたvertical-align:middle;

ありがとう

Answer 1

これが私があなたのコードで行ったことです。

html

<label class="checkbox-label"><input type="checkbox" value="115">-middle</label>

CSS

label.checkbox-label input[type=checkbox]{
    position: relative;
    vertical-align: middle;
    bottom: 1px;
}

フィドル

Answer 2

使用してみてください：

vertical-align: text-bottom;

jsフィドル

編集：

 <input id="checkbox" type="checkbox" value="115">
 <label class="checkbox-label" for="checkbox">Administrators</label>

jsフィドル

Answer 3

ラベルの行の高さを調整します。