CSS作用于输入文本而不是文本区域

Question

这是一个jsfield

http://jsfiddle.net/2GpmW/

当我设置css时，我这样做:

.inputForm input[type="text"], .inputForm input[type="email"], .inputForm textarea, .inputForm select {
    border: none;
    color: #525252;
    height: 30px;
    line-height: 15px;
    margin-bottom: 10px;
    margin-right: 6px;
    margin-top: 2px;
    outline: 0 none;
    padding: 2px 0px 2px 5px;
    width: 400px;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    background: #DFDFDF;
    font-family: inherit;
    font-size: inherit;
}

所以你可以看到CSS show同时应用于输入文本和文本区域但是由于某些原因，文本区域旁边的标签向下了文本区域内的占位符没有像输入文本

那样垂直居中

请:

1-为什么会这样?

2-如何解决

多谢

Answer 1

你必须使用这个:

textarea{
    vertical-align: top;
}

小提琴

vertical align CSS属性指定了文本的垂直对齐方式Inline或table-cell元素

Answer 2

你必须为textarea和label添加vertical-align:middle。

label, textarea{
 vertical-align: middle;
}