垂直于一行文本区域旁边的中间文本？
垂直于一行文本区域旁边的中间文本？
提问于 2013-04-05 12:23:40
我希望位于一行文本区域旁边的文本与textarea垂直居中。
如果我将文本放在type="text"输入的旁边，这就是默认行为。
我想坚持使用单行文本区域，而不是这里的输入，因为这个字段是为用户粘贴相当数量的预先格式化数据。除非程序发现问题，否则用户通常不会关心数据的内容或需要查看数据。如果发现问题，就会显示错误，如果用户可以拖出文本区域来查看数据并研究问题，那么在这一点上是有帮助的。
我的代码：
<tr>
<td class="vert" > New PNR Info
<textarea rows="1" cols="20" name="origInfo1" id="origInfo1" style="overflow:hidden"> </textarea></td>
<td align="center">Change Fee
<input type="text" size="4" id="fee"name="fee"></td>
</tr>我试过了：
这样的css：
.vert {
vertical-align: middle;
}而这个vertical-align: top;
并将两者封装在一个p标记中，如下所示
<p>New PNR Info<textarea rows="1" cols="20" name="origInfo1" id="origInfo1" style="overflow:hidden"> </textarea></p>都没有用。
如果我的问题不清楚，也许截图会有帮助。我希望红色箭头的冒犯文本像绿色箭头中的文本一样被割断。
回答 3
Stack Overflow用户
回答已采纳
发布于 2013-04-05 12:29:29
一开始似乎不符合逻辑，但是垂直对齐属性需要放在更高的元素上：
http://jsfiddle.net/N5NuA/
textarea {
vertical-align: middle;
}Stack Overflow用户
发布于 2013-04-05 12:28:22
将垂直对齐应用于所有元素，如下所示
Demo
<p class="whatever">
<label for="alignme">Label Text</label>
<textarea id="alignme"></textarea>
</p>
.whatever * {
vertical-align: middle;
}.whatever *等价于
.whatever label, .whatever textarea {
vertical-align: middle;
}Stack Overflow用户
发布于 2013-04-05 12:43:13
我相信问题在于，您正在将父元素(td或p)设置为与顶部对齐，并且由于textarea位于该元素内，因此它根据父元素对齐，而不是文本。
我认为会起作用的是设置文本区域垂直对齐。
<textarea style="vertical-alignment:middle"> 如果这不起作用，也可以将父元素更改为中间元素。如果这些更改也不起作用，请尝试文本顶部或文本底部的文本区域。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15833905
复制相关文章
相似问题
腾讯云开发者
