IE7垂直对齐“内联”元素

Question

我在IE7上有问题。我在输入（顶部和底部）中添加了填充。 在Firefox和其他版本中，标签显示在中间，但在IE7中，标签显示在底部。在IE8中，标签显示在顶部。

我试图将标签设置为vertical-align:middle样式，但是它不起作用。

它的提琴： http : //jsfiddle.net/w2wTA/4/

Answer 1

尝试为“字段” div设置line-height ，并将line-height属性设置为等于该line-height ：

#field {
    height: 40px;
    line-height: 40px;
}

编辑

您也可以尝试将一个类添加到标签和输入中，并设置填充：

<div id="field">
    <label for="t" class="t">Input:</label> <input type="text" id="t" class="t">
</div>

css ：（以某种方式，内联块不起作用，因此使用浮点数的块将达到目的，尽管我发现这有点“肮脏”）

.t{
    padding: 10px 0;
}

label{
    vertical-align: middle;
    display: block;
    float: left;
}

这似乎有效。 小提琴