ブロック レイアウトの align-content プロパティが Baseline の一部になりました

公開日: 2024 年 4 月 17 日

ブロック レイアウトとテーブル レイアウトで CSS Box Alignment の align-content プロパティを使用できるようになりました。これにより、フレックス レイアウトやグリッド レイアウトを作成しなくても、ブロック方向の配置を調整できます。

Browser Support

  • Chrome: 123.
  • Edge: 123.
  • Firefox: 125.
  • Safari: 17.4.

以前は不可能だったアイテムの垂直方向の中央揃えは、flexbox と grid、そして align-content プロパティによって簡単になりました。ただし、この配置を行うためだけに、フレキシブル レイアウトやグリッド レイアウトを作成する必要がありました。このプロパティはブロック レイアウト用に指定されており、過去数か月で 3 つの主要なエンジンすべてがこの機能をリリースしました。

ブロック レイアウトで align-content を使用すると、プロパティが機能するためのフレックス レイアウトやグリッド レイアウトを作成しなくても、垂直方向の配置を実現できます。アイテムはブロック アイテムのままで、変更は配置のみであるため、追加のプロパティは必要ありません。

align-content プロパティは、ブロック コンテナ内で見出しを垂直方向に中央揃えにします。