Html 如何将flexbox项目与textarea输入上的基线对齐

我有一个非常简单的输入表单。我想将标签与输入控件对齐，使它们处于同一级别

我决定使用

align items:baseline

，因为无论什么填充、高度等，它都会正确对齐。但是，由于某些原因，当将其与

textarea

类型的输入一起使用时，它不与基线对齐，而是在底部对齐。为什么?

当然，我可以使用

self-align

和

padding-top

对

textarea

进行修正，但这违背了在某些输入中不需要修正填充而具有灵活性的目的

我只需要理解逻辑，或者这是一个bug/已知问题

*{
保证金：0；
填充：0；
}
形式{
宽度：500px；
保证金：0自动；
背景色：#e4；
}
form.control~.control{
边缘顶部：20px；
}
.控制{
显示器：flex；
调整项目：基线；
}
.control>div:n个子项（1）{
flex:01150px；
文本对齐：右对齐；
右边填充：20px；
}
.控件>分区：第n个子项（2）{
弹性：1；
}
.控制输入，
.控制文本区{
宽度：100%；
填充：20px；
}
.控制文本区{
高度：100px；
}

标签在这里
文章
允许使用HTML

标签

问题不在于

textarea

，而在于添加到

input

和

textarea

中的

padding

，在textarea中，您不会注意到它的增长，因为

20px

x2（

40px

）不高于

100px

，但是没有填充的

输入本身只有
19px
，当您添加
40px
填充的
时，它的总高度将为
59px
。标签将在这些代码的中间对齐59px 
谢谢，我想这是有意义的。然后，我没有选择向标签添加一个类来正确对齐它们。