这个问题在这里已经有答案了：
为什么这个内联块元素被向下推？
（8个答案）
（8个答案）
七年前关闭的
这里是直播页面。
给定此HTML页面：
section[role=main]{
边缘：1米；
宽度：95%；
边框：1px实心#999；
}
第[role=main]节文章{
宽度：40%；
高度：180像素；
边缘：1米；
显示：内联块；
边框：1px纯黑；
}<；section role=“main”>；
<；文章>；爪哇</文章>；
<；文章></文章>；
</第节>；
<；section role=“main”>；
<；文章>；爪哇</文章>；
<；文章>；JavaScript</文章>；
</第节>我希望我的两篇文章都是一致的，但正如下面的屏幕截图所示，只有当我的两篇文章都有文本<；文章>元素居中对齐：
你知道是什么导致了这种行为，以及如何修复它吗
添加：
垂直对齐：底部；
你的第二条规则应该让它起作用。显然，没有文本的内联块被渲染为内联图像或其他内容，并且这些元素的垂直对齐是不正确的，因此强制它们与底部对齐可以解决这个问题
源：没有文本的内联块元素以不同方式渲染