From the course: CSS: Advanced Layouts with Grid

Unlock the full course today

Join today to access over 22,500 courses taught by industry experts or purchase this course individually.

Create the shared grid

Create the shared grid - CSS Tutorial

From the course: CSS: Advanced Layouts with Grid

Start my 1-month free trial

Create the shared grid

“

[Instructor] If the browser supports CSS Grid we need to get rid of this site rule up here because we no longer want to restrict the width of the total content. So I'll say site, and I'll just counteract this max width by saying max-width: none and save that. If you check this in the browser, you'll see now everything is full bleed so that means if there are certain elements that we're not going to do anything else to, like this image, we don't actually have to apply a grid to it because it's already doing what we want. But when you scroll down, you see there's some pieces of content here that really need the grid, in particular these sections, the splash section, the buckets section and then the two sections below here. So there's still some work to be done. You'll remember from the intro movie to this chapter that we can't just apply a grid to the site rule so that there's one global grid for everything. Instead we have to create a grid rule that applies to each of the sections…

Contents