0

我有一个表单元素列表。标签位于每个元素旁边。有些标签,有些有文字。它们在不同的浏览器中表现不同。

基本上发生的事情是具有文本的标签在列表项上方创建空白。表单比这复杂得多,但我把它归结为这个基本代码: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/

4

1 回答 1

1

vertical-align: top;在列表项上使用:http: //jsfiddle.net/uZ2Et/1/

于 2012-10-03T21:53:02.837 回答