| summary | time | deliverables |
|---|---|---|
Create a responsive image and caption using the CSS position properties and media queries. |
1 hour |
1 HTML file, 1 CSS file, images |
- Fork this repository.
- Code the layout that matches the screenshots.
- Text can be found inside the
content.txtfile. - Run it through Markbot and make sure it passes all the checks.
- Typefaces:
Denk One,Georgia - Text sizes:
1.5rem - Colours:
#e2e2e2,rgba(0, 0, 0, .3) - Standard media query widths:
38em,60em,90em - Standard text sizes & line heights:
100%/1.3,110%/1.4,120%/1.5,130%/1.5
Visually match the images in the “screenshots” folder and create the interaction shown in the linked video.
- Final screenshots in the “screenshots” folder.
- Watch this video to see how it interacts.
Drop this folder into your Markbot application. Make sure to fix all the errors. And submit for grades using Markbot.