文本未与相应的复选框对齐

Question

<div ng-repeat="option in LgODDL track by $index">
    <label> 
        <input type="checkbox" ng-model="selected[$index]" ng-click="toggleOrderSelection(option.Number, option.NumberDetails)">  {{option.NumberDetails}}
    </label>
</div>

我认为这是我唯一可能影响这个问题的CSS：

input {
    line-height: normal;
    height: 22px;
    white-space: nowrap;
}

有谁可以告诉我为什么上面的代码会生成与复选框不均匀对齐的文字？

Answer 1

将以下样式添加到<input>标记：

.checkbox-align {
  padding-top: 7px;
  margin-bottom: 0;
  vertical-align: middle;
}