为文本区域制作一个标签，放在它旁边，但垂直居中对齐

Question

请看一下这个小提琴： http://jsfiddle.net/hughbe/QYGcq/

如您所见，标签对于 应该是在 textarea 旁边，但是，我想使标签垂直位于文本区域旁边，或位于文本区域的顶部，而不是像小提琴中那样位于底部。

我尝试将其 css 设置为 vertical-align: middle 但这不起作用。我必须做什么才能使标签在顶部或中间对齐？

谢谢。

Answer 1

在文本区域上使用 vertical-align: middle http://jsfiddle.net/VxY6m/

因为垂直对齐意味着相对于文本行 - 在本例中为标签。

Answer 2

试试这个：

<style>
    label {
        display: block; 
        float: left; 
        padding-top: 8px
    }
    textarea {
        resize: none; 
        overflow-y: hidden;        
    }
</style>
<label for="FooText">Content:</label>
<textarea id="FooText"></textarea>

我所做的是将标签设为块元素并对其应用顶部填充。
另请参阅fiddle。