Utiliser Grid comme container de texte

  • grid

Bonne pratique pour du contenu texte en gérant différentes largeurs de blocs

.grid-content {
    display: grid;
    grid-template-columns:
        [full-width-start] 24px
		[breakout-start] 48px
			[content-start] 1fr [content-end]
		48px [breakout-end]
        24px [full-width-end];
    & > * {
        grid-column: content;
    }

    & > .breakout {
        grid-column: breakout;
    }

    & > .full-width {
        grid-column: full-width;
    }
}