/flexible-info-card

Review your knowledge of Flexbox with this small web design assignment.

Primary LanguageHTML

summary time deliverables
Review your knowledge of Flexbox with this small web design assignment.
1 hour
1 HTML file, 1 CSS file, images

Flexible info card

Overview

  • Fork this repository.
  • Review & apply your Flexbox knowledge to re-create the layout.
  • DO NOT change the HTML file.
  • Run it through Markbot and make sure it passes all the checks.

Details

  • Typefaces: Open Sans
  • Colours: #444, #000
  • Line-heights: 1.5
  • Margins: 1.5rem
  • Paddings: .5rem 1rem .6rem, 2rem
  • Widths: 24rem, 16rem, 5rem

Goal

Visually match the images in the “screenshots” folder and create the interaction shown in the linked video.

  • Final screenshots in the “screenshots” folder.

Hand in

Drop this folder into your Markbot application. Make sure to fix all the errors. And submit for grades using Markbot.