Friday, August 1, 2014

Formatting Review Footer Images

Okay so you've written your review and you're trying to offer your readers a list of other books they may really enjoy if this one was to their taste but instead of looking like this:









Your images are looking something like this:











Solution:

You will need to switch to your HTML view:

First lets take a look at my messed up code. You should see the "If you enjoyed" text at the top and three linked image codes throughout (as there are three images). Remember: linked images start with <a href= and end with </a>















Here all the image codes are highlighted. We want nothing typed between image codes so the </div> or anything else you see between your image codes needs to be deleted.




Next: 

  1. Delete all of the style="" specifics for each image. You MUST do this for every image. I've highlighted the style sections in the example below.
  2. Make one space between each of your image codes (see green circles). This will ensure that your images are spaced evenly once you are done with this step.

If you have a <div class=" line above your images then delete it or make sure the text-align section is set to left. I chose to delete the entire highlighted line in this example rather than change the circled "center" to "left".

Finally, If you are having trouble getting the proper amount of space above or below your images
  1. There should be two <br /> after your "If you enjoyed" line and before your images
  2. There should be nothing but </div> after your images


That should do it! Let me know if you encounter difficulties.

No comments:

Post a Comment