This course has been updated! We now recommend you take the CSS Grid & Flexbox for Responsive Layouts, v2 course.

Check out a free preview of the full CSS Grids and Flexbox for Responsive Web Design course:
The "Mondrian Painting Exercise Solution" Lesson is part of the full, CSS Grids and Flexbox for Responsive Web Design course featured in this preview video. Here's what you'd learn in this lesson:

Using ‘grid-row’ and g’rid-column’ for general placement and sizing, Jen lays out the solution for this exercise.

Get Unlimited Access Now

Transcript from the "Mondrian Painting Exercise Solution" Lesson

[00:00:00]
>> Jen Kramer: So you should have something that looks kinda like this. Again, the right shape, the wrong distribution of those shapes, they aren't the right heights and widths and so forth. But you can see that the shape of the boxes that we've specified here match the shape of the painting.

[00:00:17] So did everybody here in the classroom, did you manage to get an answer look like that? All the heads are nodding, okay. So my CSS code looks something like this. So we have a series of the row, I guess for lack of a better term, row spans and call spans, right?

[00:00:38] So we have a whole series of these, d through g.