| summary | Create a small layout using grids, hiding and showing units & position. |
|---|---|
| time | 1 hour |
| deliverables | 1 HTML file, 2 CSS files, images |
- Fork this repository.
- Match the layout found in the screenshots—notice how one of the grid units isn’t always visible.
- You’ll need a little bit of CSS inside your
main.cssto make the caption look right. - Text can be found inside the
content.txtfile. - Run it through Markbot and make sure it passes all the checks.
- Typefaces:
Roboto Slab - Line-height:
1.3 - Measurements:
1rem,.5rem - Caption max-width:
15em - Expected class names:
.img-flex - Gridifier settings: defaults
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.