Help – images not floating left!

• 

  mrmacmusic · Member · Dec 21, 2011 at 4:13 pm

  • Copy link
  • Add topic to favorites

  Hi everyone – this is my first forum post here, so please be gentle :-)

  I’ve come across an issue with page rendering that’s driving me daft!! I created a page to showcase my designs, and regularly update it either moving artworks or updating them. My page contains a number of images, all of which have been CSS styled **exactly the same way** in the HTML editor (float left, margin-right etc.).

  When the page is viewed however, there are spaces rendered between images that just shouldn’t be there – and checking the HTML source output doesn’t show any spurious spacing, margin or padding code… each image line is identical from a CSS perspective.

  It’s got me baffled, and a bit frustrated. Any ideas?

  The page can be viewed here – http://mrmacmusic.wordpress.com/iphone-cases/ with suspicious spacing appearing after the first line of “More Designs”.

  The blog I need help with is: (visible only to logged in users)

• 

  panaghiotisadam · Member · Dec 21, 2011 at 5:42 pm

  • Copy link

  They are styled exactly the same way but they aren’t all the same height: some are 349px but some are 350px, and this obstructs the floating. Add this after every four image codes:
  <br style="clear:both;" />

• 

  mrmacmusic · Member · Dec 21, 2011 at 6:23 pm

  • Copy link

  D’oh! Missed the size discrepancies… thanks for that :-)