使用多个文本区域居中多个标签[重复]答案

【问题标题】：Center multiple labels with multiple textarea [duplicate]使用多个文本区域居中多个标签[重复]
【发布时间】：2015-05-14 14:56:17
【问题描述】：

我有多个标签和文本区域。他们排成这样：

       __________________
      |                  |
      |                  |
Label:|__________________|

我希望它是这样的：

       __________________
      |                  |
Label:|                  |
      |__________________|

这个问题已经有了答案除了我有多个标签和文本区域。所以我尝试使用答案：

CSS：

.label_textarea {
    vertical-align: middle;
}

HTML：

<p class="label_textarea">
<label>Label for textarea</label>
<textarea rows="5">Textarea</textarea>
</p>

但这对我不起作用。它不会改变布局中的任何内容。而且标签和文本区域的组合数量每次都不一样，所以我不能使用标准数量。

我应该在这里做什么才能得到我想要的结果？

【问题讨论】：

嗨，正如您在所链接问题的已接受答案中看到的那样，vertical-align 属性设置在子级（label 和 textarea）与 .formfield * 选择器上，而不是就像您在示例中所做的那样在容器上。
@web-tiki 啊哈，是的，谢谢，但我仍然需要做一些该答案中没有的更改才能使其正常工作。
喜欢这个jsfiddle.net/webtiki/s6pzo2hx ?

标签： html css

【解决方案1】：

尝试为标签提供line-height 属性以及vertical-align Demo

CSS：

label {
    line-height:50px;
    vertical-align::middle;
    display:block;
    float:left;
    padding:5px 10px;
}
textarea {  
    display:block;
    float:left;
}

HTML：

<p>
    <label>label</label>
    <textarea></textarea>
</p>

【讨论】：

只针对标签，还是针对文本区域？
仅用于标签，不适用于文本区域