How to get rid of spaces between images?

5 replies
  • WEB DESIGN
  • |
I'm chopping up a large image into smaller pieces, so that I can make buttons out of them when I put them back together as the full image.

Problem: when I insert the images into the Wordpress page, they touch up fine horizontally...but vertically, there is white space between the "rows".

I've googled the problem but the css is beyond me. I tried all kinds of <div> coding etc. in the html editor without improvement.

Anyone have an easy solution for this? Thanks!
#images #rid #spaces
  • {{ DiscussionBoard.errors[8178585].message }}
    • Profile picture of the author RobinInTexas
      This is not at all elegant but it works for me in a lot of situations.
      Code:
      <img style="float:left; width: 150px; height:150px; 
      margin-left: 10px; margin-top: 10px; 
      margin-right: 10px; margin-bottom: 10px;" src="xyz.jpg" alt="something">
      I added a couple of line feeds for visibility on the forum, they are not necessary.
      Obviously you need to adjust the settings, the key is the margin which can be negative.
      Signature

      Robin



      ...Even if you're on the right track, you'll get run over if you just set there.
      {{ DiscussionBoard.errors[8178958].message }}
  • Profile picture of the author dazamate
    That's the long way, you can apply the same margin levels to all dimensions by

    Code:
    <img style="float:left; width: 150px; height:150px; margin:10px;" src="xyz.jpg" alt="something">
    OP there must be some code in your stylesheet that is applying margin or padding to the bottom of your images. You can try this with your images...

    Code:
    <img style="margin:0; padding:0;" src="xyz.jpg" alt="something">
    {{ DiscussionBoard.errors[8179331].message }}
    • Profile picture of the author abhishekcis
      Thanks mate..it worked for me..!!!
      {{ DiscussionBoard.errors[8183557].message }}
  • Profile picture of the author webworksbd
    Can you upload a screen shot here. So that we can understand more better what exact problem you are facing.
    Originally Posted by Jason Kanigan View Post

    I'm chopping up a large image into smaller pieces, so that I can make buttons out of them when I put them back together as the full image.

    Problem: when I insert the images into the Wordpress page, they touch up fine horizontally...but vertically, there is white space between the "rows".

    I've googled the problem but the css is beyond me. I tried all kinds of <div> coding etc. in the html editor without improvement.

    Anyone have an easy solution for this? Thanks!
    Signature

    Need a WordPress Developer? View my gigs at Fiverr.com

    {{ DiscussionBoard.errors[8179351].message }}

Trending Topics