summary | time | deliverables |
---|---|---|
Create a grid-based, responsive layout using the Gridifier tool. |
1 hour |
1 HTML file, 1 CSS file, images |
- Fork this repository.
- Use Gridifier to create the responsive, grid-based layout.
- Your
main.css
file should only have the responsive website defaults, andOpen Sans
inhtml
—nothing else. Don’t changefont-size
,margin
,padding
—anything. Except removing themargin
frombody
. - Text can be found inside the
content.txt
file. - Run it through Markbot and make sure it passes all the checks.
- Typefaces:
Open Sans
(include “regular 400”, “regular 400 italic” & “bold 700” from Google Fonts) - Text sizes: unchanged
- Margins & paddings: unchanged, except for the
body
- Expected class names:
.img-flex
,.grid
,.unit
, grid sizing classes - 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.