在 Chrome 123 中，您可以在區塊和表格版面配置上使用 CSS Box 對齊的 align-content 屬性。這樣就能讓區塊方向對齊，無需建立彈性或格狀版面配置。但是，如果您已在這些版面配置方法之外使用 align-content，可能需要更新 CSS，因為這項功能現在就會生效。
瀏覽器支援
- 123
- 123
- 125
- 17.4
彈性和格狀版面配置中的 align-content
您可能已使用 align-content 對齊彈性項目或格線軌道。在彈性版面配置中，Flex 容器會使用 align-content 屬性，讓交叉軸上的彈性項目對齊。在以下範例中，其值為 space-between，因此會在彈性容器之間分配可用空間。
align-content 屬性會佔據 Flex 項目的資料列。將項目垂直置中
其中 align-content 特別適合用於將項目垂直置中於容器內。為此，請使用 display: flex 和 align-content: center。這會導致項目成為彈性項目，而其他預設彈性項目行為也會生效。在以下範例中，標題以 align-content: center 垂直置中，這會導致項目縮小以配合內容，因此您需要為項目套用 flex-grow: 1。
align-content 屬性會在彈性容器中垂直將標題置中。針對區塊版面配置，您可以使用 align-content 來實現垂直對齊，而不需要為屬性建立彈性版面配置。由於項目仍是區塊項目，因此不需要其他屬性，唯一的更動是對齊方式。
align-content 屬性會將標題垂直置中於區塊容器 (需使用 Chrome 123 或 Safari 17.4 以上版本)。測試在區塊版面配置中對 align-content 的支援
很抱歉，您無法測試區塊版面配置中對 align-content 的支援。由於 align-content 在 Flex 和格線版面配置中已長期支援，因此使用 @supports 的功能查詢一律會傳回 true。這與 flexbox 中的 gap 屬性相同。CSS Working Group 正探索類似這類部分實作的解決方案。
檢查網站是否與預期不符
在規格中，align-content 屬性已定義好多年，以便用於區塊版面配置。由於上述環境以外的瀏覽器都不支援 align-content，因此它沒有任何作用。不過，如果您已將這項屬性新增至非 Flex 或格線容器，則自 Chrome 123 版起，該屬性就會生效。請搜尋 CSS 來使用 align-content，並透過 Beta 版測試網站和應用程式。