Practice Your New Skills


Pick one of the two examples to practice in a course that is unpublished or does not have students enrolled.

I recommend starting with a fresh page to practice. If this is your first time entering the HTML Editor, it might be easier to start simple.

Also, careful not to delete any punctuation. HTML is very sensitive.

On a brand new page (or in an existing page):

  • that has image and text, add image padding HTML to an image...

    • Play with the following yellow-highlighted numbers to see how surrounding text gets closer or farther from your image:
img style="float: left; padding-right: 30px; padding-bottom: 10px"
    • What if you changed 30px to 100%? 
    • If there is text wrapped under your image, what if you changed 10 to 60?

 

  • that can use some fancy dividers...

    • Play with the following yellow-highlighted numbers ("100%" and "#FF0000") to see how surrounding text gets closer or farther from your image:
<div class="aligncenter" style="width: 100%; height: 3px; border-top: 2px dotted #FF0000; border-bottom: 2px dotted #FF0000; font-size: 0;">-</div>

 

    • What if you changed 100% to 50%
    • What if you changed only one of the #FF0000 to a different Hex #?