Css 为什么内联块div有内容时会被放在较低的位置？

如果有三个相同的div放置在内联块中，它们将完全对齐。但是如果你把任何内容放在任何一个div中，它就会下降到其他div的下面。为什么会这样

<div class="left">?</div>
<div class="center"></div>
<div class="right"></div>

div {
    display:inline-block;
    margin-:2px;
    height:100px;
    width:25px;
    border:1px solid black;
}​

？
div{
显示：内联块；
边距-：2px；
高度：100px；
宽度：25px；
边框：1px纯黑；
}​

---

更好的示例：

这是因为垂直对齐默认设置为基线。 您可以通过将问题设置为顶部来解决问题：

div {
    display:inline-block;
    margin-:2px;
    height:100px;
    width:25px;
    border:1px solid black;
    vertical-align: top;
}​

---

这里的演示：

我甚至不知道垂直对齐在这里起作用。