稍后我将提取样式。我想学习如何用直线HTML做到这一点。如何将较大的复选框垂直对齐到中间
请注意,只要我的复选框是默认大小,我的wrap1 div中的所有内容垂直对齐在中间。
如果我改变复选框的大小,然后垂直对齐似乎停止工作。 Here is my JSFiddle。
<div id="wrapper" style="width: 80%; height: 100%; overflow:hidden; margin: 0 auto; float: left">
<div class="row" style="width: 100%; height: 80%; margin: 0 0 0 0; float: left; background-color: aqua;">
<div id="heading" class="row">
<p style="text-align: center;">This is a title</p>
</div>
<div class="wrap1" style="vertical-align: middle;">
<div style="width: 15%; line-height: 53px; text-align: center; background-color: yellow; display: inline-block;">
<input type="checkbox" style="height: 30px; width: 30px;">
</div><div style="width: 70%; line-height: 53px; background-color: orange; display: inline-block;"><label>Description</label>
</div><div style="width: 15%; line-height: 53px; text-align: center; background-color:green; display: inline-block;">
<label>100</label>
</div>
</div>
</div>
</div>
你使用' transform:scale(X)'改变复选框的大小? –
不!我用style =“height:30px; width:30px;”在html中。 – Patricia
它在Chrome中不起作用,并将对齐分隔为其他'div'块。 –