Video source missing

CSS Grid: Overlapping Content Layout (Advanced)

In by Pausha Foley

In this advanced layout breakdown we’ll take a look at creating gaps between content in our layout using the template rows and columns rather than the actual “Gap” controls available to us on the Grid Element. Additionally, we’ll show how we can have multiple pieces of content occupy the same grid tracks to create a detailed and layered look along with that content spreading to the far edge of the screen. We’ve also got a fun little easter egg in about giving your content a “max width” without explicitly using CSS max-width, so definitely check that out!