summary | time | deliverables |
---|---|---|
Use the CSS float property to add some insets into a piece of text. |
1 hour |
1 HTML file, 1 CSS file, images |
- Fork this repository.
- Style the dropcap to match the screenshot.
- Style the image and caption to match the screenshot.
- Style the pull-quote to match the screenhots.
- DO NOT change the HTML.
- Some of the CSS is marked as DO NOT touch.
- Run it through Markbot and make sure it passes all the checks.
- Colours:
#333
,#666
,#f2f2f2
- Border thickness:
3px
- Text sizes:
5rem
,1.5rem
,.875rem
- Paddings:
.4em .2em
,6px 0
,6px
- Image & pull-quote width:
300px
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.