垂直对齐绝对定位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; 
} 

好你已经有一个表，vertical centering via CSS是不容易的。

顺便说一句：与其两个div和绝对定位，你可以使用margin-left: -30px;