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垂直中間輸入複選框

回答

相關問題