Demos

CSS Gap Decorations demos

This directory contains demos that showcase the use of CSS Gap Decorations, a feature proposal by the Microsoft Edge team to draw line decorations within gaps in CSS Grid, Flexbox, and Multi-column layouts.

Demos

• Burger Menu - burger-menu.html
• Calendar - calendar.html
• Daily CSS News - daily-css-news.html
• Guitar Fretboard - guitar-fretboard.html
• Notebook - notebook.html
• Personal site - personal-site.html
• The Daily Oddity - the-daily-oddity.html
• Article Grid - article-grid.html
• Calendar Week View - calendar-week.html
• Dashboard Grid - dashboard-grid.html
• Dynamic Items - dynamic-items.html
• Settings List - settings-list.html
• Split Screen - split-screen.html

Developer playground

• CSS Gap Decorations playground - playground.html

Try the feature

CSS Gap Decorations is available by default in Chrome and Edge 149+. Just open any of the demos above in a supported browser.

Share feedback

To share feedback, please open an issue on the MSEdgeExplainers repository.

This site is open source. Improve this page.