Flexbox and Grid for Responsive Web

1. Intro to floats

Instructions

Look at the HTML file source. Notice the comments explaining the type of layout desired in a 4-column grid system at desktop dimensions.

Write the appropriate CSS to achieve the layouts specified for desktop.

Go farther:

Write the grid in mobile-first fashion.

Styles outside the media queries are universal and work to display the site in mobile format.
Two media queries are provided for “tablet” and “desktop” dimensions. Write styles that override the mobile layouts here.

Boston's famous dessert, a combination of yellow cake, vanilla pudding, and chocolate frosting.

Coconut cream pie will take you to an island escape. Especially delicious in winter.

Key lime pie is based on the tiny key limes from Florida. These limes are less sour than conventional limes.

A staple of every Thanksgiving dinner table, pumpkin pie is delicious any time of year.

Key lime pie is based on the tiny key limes from Florida. These limes are less sour than conventional limes.

A staple of every Thanksgiving dinner table, pumpkin pie is delicious any time of year.

Boston's famous dessert, a combination of yellow cake, vanilla pudding, and chocolate frosting.

Coconut cream pie will take you to an island escape. Especially delicious in winter.

Boston's famous dessert, a combination of yellow cake, vanilla pudding, and chocolate frosting.