Flexbox and Grid for Responsive Web
Source code
5. Flexbox gallery
Instructions

Starting files are a series of images with captions, marked up as figures.

Display these on the page as an image gallery using Flexbox.

Pretend you do not know how many images you will display. This is a real-world problem – you may have a server sending you many images, or a few images, which must be displayed on a page to look good.

Test your result by adding more images (copy and paste the code present a few times) or removing images (delete some of the images) and make sure the page still looks good.

Hint: this is NOT a grid-based problem. This is how Flexbox was actually meant to be used – a series of items, displayed on a page.

There are two possible solutions I identified. Both are technically correct. You can choose which you like based on your design preferences. Perhaps you can find other solutions?

  • Apple pie.
    Apple pie, featuring apples from the latest harvest.
  • Boston cream pie.
    Boston cream pie is the best!
  • Cherry pie with ice cream.
    Mmm... cherry pie and ice cream hits the spot!
  • Cherry pie.
    Cherry pie is available for a short season!
  • Coconut creme pie.
    Coconut cream pie will transport you to the islands.
  • Pie is all gone.
    Hurry before the pie is all gone!
  • Key lime pie.
    Key lime pie, featuring the smaller, sweeter limes of the Florida Keys.
  • Lemon meringue pie.
    Lemon meringue pie, best consumed the day it's made.
  • Mincemeat pie.
    Mincemeat pie for your traditional Thanksgiving table.
  • Mini pies.
    Mini-pies... you can eat more than one!
  • Mom pie.
    We make the best pies for Mother's Day!
  • Peace pie, made of blueberries and raspberries.
    Our Peace Pie is made of summer's best blueberries and raspberries.
  • Peach pie.
    Peach pie, a piece of Southern heaven.
  • Pie and coffee.
    What could be better than Merilee's pie and a hot cup of coffee?
  • Buffet of pie slices.
    Heaven includes a buffet of pie options!
  • Pumpkin pie.
    Pumpkin pie, a best-seller for Thanksgiving!
  • Whole pie buffet.
    When slices aren't enough, offer a buffet of whole pies!