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中文網其他相關文章！
