Brief CSS Layout Exercise
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

CSS Layout Exercise

Builds from our styling exercise, using very similar HTML.

We use a funny method here: I have provided all the relevant selectors, but I have commented most of them out. In class, we'll use Firefox Dev tools to sequentially "uncomment" the relevant selectors. You can do the same on your own, experimenting as you go.

Another great place to learn this stuff is in the MDN Layout sections which start here and cover this material as well as a lot more.

For now, this exercise covers basics of both flex and grid. You will need to extend this lesson slightly to use nesting in the homework.