javascript - 垂直对齐绝对定位的 div

Question

我有两个元素；输入字段和 div - 一个挨着另一个。Div 绝对定位在相对元素内部，并定位在输入的右侧。

输入具有固定高度，但 div 的高度取决于内容。

我想要实现的是在输入旁边居中垂直对齐 div。我不确定这是否可能是纯 CSS，所以这就是我添加 javascript 标记的原因。

HTML：

<td>
<input type="text"/>
<div id="rel" style='position:relative;'>
<div id="content">
content
</div>
</div>
</td>

CSS：

#content {

position:absolute;
left:30px;

}

...

Answer 1

只需使用

td input {
    vertical-align:middle;
}

很好，你已经有了一个表格，通过 CSS 垂直居中并不容易。

顺便说一句：您可以使用而不是两个 div 和绝对定位margin-left: -30px;