From the course: CSS: Combining Grid and Flexbox

Unlock the full course today

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

Media objects for desktop

Media objects for desktop - CSS Tutorial

From the course: CSS: Combining Grid and Flexbox

Start my 1-month free trial Buy for my team

Media objects for desktop

“

- [Instructor] Now let's improve our large screen layout. As you can see, as my page gets wider, the media objects get far too wide. It's going to look much better if these display side by side. In addition, our heading and introductory paragraph do not display optimally at the large screen either. Go ahead and go down to the bottom of your CSS file where you'll find the comment for the large screen action area. We're going to start working from the top down, and we'll switch the layout of the action headline and introductory paragraph. As usual, we can resolve this layout issue using Flex or Grid. Let's use Grid since we've already used Flex to do this sort of layout. This way, you can compare the various methods. In addition, Grid will allow us to more easily control the column widths. It is worth noting out that I've already set a max-width of 1,200 pixels. This is on the action section and this will prevent this…

Contents