Extra space at bottom of image

  • Before switching to a new theme I would apply a style to an image to get it to right or left align in my post and have it outlined with a small border. Now I’m getting an extra space at the bottom border of the image when it should be evenly spaced all the way around. I’ve even tried modifying the css to see if it would affect anything, but to no avail.

    Surely it’s something to do with my css, but I can’t figure out how. Can someone please take a look at the image in the post at the top of https://www.familywebwatch.com/blog/ and offer suggestions?

    Thanks! ??

Viewing 10 replies - 1 through 10 (of 10 total)

  • Taking a look at your spring_flavour.css file, could it be the 10 px border you have in there for margin? Since you have the margin set for the right and the bottom side of the image.

    Also, nice job on the neatly commented/laid out index/css files.

    Thread Starter davincim

    (@davincim)

    Thanks, lawtai. ??

    Shouldn’t that parameter affect the spacing outside the border? When I was trying to figure out what was going on, I changed it, but it didn’t affect anything.

    actually, thinking about it, I’m wondering if your “double spacing” of posts is playing into it since it seems to insert an extra break in there underneath the picture despite where the text is actually located.

    oh lol, i should read closer to what you’re trying to say since i was thinking you were talking about the large gap outside the borders. I still think the double spacing is a possibility though.

    Thread Starter davincim

    (@davincim)

    Double spacing? Hmmm. I don’t think I’ve manually changed anything to make it double-space. Can you be more specific?

    heh, to me your site looks like it’s double spaced with the gap between your text. Did you get that look by running a double spacing plugin that I saw on WP before, or did you just use line-height/spacing?

    Thread Starter davincim

    (@davincim)

    No, no plugin. But you got me to thinking. I went to check out my style sheet and found a couple of references to “line-height” which I think might be affecting this (since it’s a new theme and therefore a new css, I’m still getting familiar with it). I’ll play around with those and post back the results.

    Thanks again for your help, lawtai. ??

    another interesting thing is that if you increase/decrease the size of your entire page the bottom gap will also increase/decrease. I’m thinking this is caused by one of your em declerations, as px doesn’t scale when changing font sizes.

    Thread Starter davincim

    (@davincim)

    As promised, I’m posting back with results for future generations. ??

    It was the line-height making that extra space. To fix it, I changed the css responsible for making the border by adding a line-height:0;. After that, the border appeared evenly around my images.

    did you have an em decleration there before?

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Extra space at bottom of image’ is closed to new replies.