CSS垂直中间输入复选框

我喜欢在div中垂直居中复选框。我已经尝试使用display: inline-block设置vertical-aligin: middle。这是唯一的锻炼，而复选框iteself是100%。但是完全可以选择100%。还试图将复选框包装到vertical-aligin: middle和display: inline-block未成功的另一个div中。CSS垂直中间输入复选框

<div style='height:100%;'> 
    <input type='checkbox' style='display: inline-block; vertical-aligin: middle'/> 
</div>

enter image description here

我现在的解决方案是：

input[type="checkbox"] { 
    top: calc(50% - 6.5px); 
    position: relative; 
    }

来源

2014-01-07 MR.ABC

你可以做这样的事情

<div style='height:300px; background: blue;'> 
    <input type='checkbox' style='display: inline-block; position: relative; top: 48%;'/> 
</div>

看到这里http://jsfiddle.net/j9c9V/

来源

2014-01-07 21:22:23 CRABOLO

CSS垂直中间输入复选框

回答

相关问题