Inline-Block 列的垂直对齐
使用 display:inline-block 创建列时，添加内容时会变得很明显到第一列，后续列垂直下降。这可以通过使用 Vertical-align CSS 属性来解决。
要避免此问题，请添加 Vertical-align: top;到容器的 CSS 声明。这可以确保所有列在顶部垂直对齐，无论每列中的内容如何。
.cont span {
display: inline-block;
vertical-align: top;
height:100%;
line-height: 100%;
width: 33.33%;
outline: 1px dashed red; /* Just for Demo */
}替代方法
尽管 inline-block 可用于创建列，由于列之间潜在的空白问题，它可能不是最佳解决方案。考虑使用弹性框或 CSS 网格，因为它们可以更好地控制列布局和对齐。
以上是如何垂直对齐内联块列？的详细内容。更多信息请关注PHP中文网其他相关文章！
