From the course: CSS: Combining Grid and Flexbox

Unlock the full course today

Join today to access over 24,400 courses taught by industry experts.

Problem section

Problem section

- [Instructor] Up next on our website is the problem section. At the small version of the website, everything is working the way we want. We have a headline, a paragraph, an H3, an unordered list, and then we're displaying an image. As the page expands and gets wider, the layout is going to change. We're actually going to swap out the image with this illustration that is going to serve as a background. We're moving the H1 to the left and then having the paragraph that immediately follows it appear to the right. Then on the right side, we'll list our H3 and our unordered list. I'm going to start you off with the CSS for the small screen. And as I mentioned, there's really nothing to do here. But as my screen gets larger, you can see that our layout gets a little bit wonky. So we'll have to make some adjustments in order to reign these items in and have them display in the way that we want. Let me introduce…

Contents