垂直对齐复选框标签?

时间:2013-03-05 17:57:55

标签: html css

我有这样的复选框:

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

但我无法弄清楚如何将标签设置为与复选框居中对齐。

我尝试添加vertical-align:middle;

由于

3 个答案:

答案 0 :(得分:55)

这就是我对你的代码所做的。

<强> 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;
}

Fiddle

答案 1 :(得分:4)

尝试使用:

vertical-align: text-bottom;

jsFiddle

修改

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

jsFiddle

答案 2 :(得分:-2)

调整标签的行高。