gapに線をひきたい！ GridとFlexboxの余白に罫線を入れられる新CSS「Gap Decorations」

概要

ICS MEDIAの記事。Chrome・Edge 149（2026年6月）から利用可能になったCSS Gap Decorationsを紹介している。従来、Grid LayoutやFlexboxの余白（gap）に罫線を入れるには疑似要素などを使った複雑な実装が必要だったが、新しいCSSプロパティで直接指定できるようになった。

詳細

• Chrome/Edge 149以降で利用可能な新CSS機能
• Grid LayoutおよびFlexboxのgap部分に直接罫線を引けるようになった
• 従来は疑似要素などで代替実装が必要だった
• CSSの進化でレイアウト表現の幅が拡大

参照

• 出典: https://ics.media/entry/260618/
• はてなブックマーク数: 8