Next, we are going to add some sample code to the image and save it. This will serve as a marker so we can take a look at the code using the Developer View of your browser.

Padding Code:

style=”padding-top:10px;”

style=”padding-bottom:10px;”

style=”padding-left:10px;”

style=”padding-right:10px;”

style="padding: 10px;"

NOTE: If you add the bolded code above, you will add 10px of space around the whole image because you are not specifying top, bottom, left or right.

To add the padding:

1. Open the text tab on your post
   
2. Find where the image code string is that you want to add padding to
   
3. Copy a line of code from above
   
4. Leave the padding set to 10px
   
5. Paste the code in front of src="http://
   
6. Make sure there's a space before the src
7. Click on the Visual tab to confirm that your image has moved 10px and that you can still see the image.
8. Save your changes

Be sure there is a space between the " from the padding code and the src

In the next lesson, you will see the code after it's been saved.

When we open the Developer View of our browser, we will have a chance to play with the number of pixels live on screen and decide how much space is actually enough.