Html 垂直对齐行为

我刚刚注意到Chrome的一个奇怪行为。 将垂直对齐特性应用于div时，其内部的文本节点也将对齐

使用Firefox时，文本节点将忽略该属性

这是一个Chrome bug吗？

文本
div{
垂直对齐：顶部；
字体大小：11px；
}

这似乎是将垂直对齐：top应用于div的预期行为。如果需要简单的修复，只需将输入框的高度应用于div即可。这将使文本垂直居中于输入的右侧

div {
  vertical-align: top;
  font-size: 11px;
  line-height: 16px;
}

---

如果你把它改为文本顶部，它就会在Chrome中匹配。我不知道你的意思，但从我看到的，你正在对齐div。这意味着，div和里面的所有东西都将垂直对齐顶部。您的单词“text”存在于输入标记之外，输入标记将其置于div标记中，与输入标记无关。因此，它将与顶部对齐。我可能错了。顺便说一句，你的问题中有一个额外的“>”标记。垂直对齐：

垂直对齐属性会影响内联级别元素生成的框的线框内的垂直定位。

这看起来像是webkit错误，因为所有其他浏览器的行为都与预期一致。垂直对齐不适用于框级元素，因此webkit似乎要么解释错误，要么试图提供帮助。

div {
  vertical-align: top;
  font-size: 11px;
  line-height: 16px;
}