我有一个表单元素列表。标签位于每个元素旁边。有些标签,有些有文字。它们在不同的浏览器中表现不同。
基本上发生的事情是具有文本的标签在列表项上方创建空白。表单比这复杂得多,但我把它归结为这个基本代码:http: //jsfiddle.net/uZ2Et/
#cleanVersion li {
display: inline-block;
border: 1px solid gray;
height: 200px;
margin: 0;
padding: 0;
}
#cleanVersion label {
display: inline-block;
font-size: 70px;
background-color: blue;
border: 0;
margin: 0;
padding: 0;
width: 200px;
height: 150px;
}
<div id="cleanVersion">
<ul>
<li><label>test</label></li>
<li><label></label></li>
</ul>
</div>
我试过调整边距、边框、填充、行高......但标签仍然不一致。
如何摆脱出现在带有文本的列表项上方的空白?
编辑:这是一个更复杂的例子,更接近我实际在做的事情:http: //jsfiddle.net/uZ2Et/6/