Need help? Check out our Support site, then


Suburbia, Comments, CSS, White Space

  1. On this page: http://hertshps.wordpress.com/forum/

    Before each comment is a few lines of white space - can someone show me the CSS to reduce that? I've looked at the CSS for Suburbia and tried a few edits to try out changes to the Comment CSS but no luck yet.

    The blog I need help with is hertshps.wordpress.com.

  2. It's actually top margin on the comments that does that. Add this to your CSS and then adjust the 35px top margin value as desired.

    .comment, .pingback {
    margin-top: 35px;
    }
  3. Brilliant thanks - have a look now, there's still a blank line above and below the dividing line - can I eliminate that too?

    http://hertshps.wordpress.com/forum/

  4. Actually I think it looks quite nice right now, but then again I like whitespace. If you take away too much, things will visually run together and be more difficult to read. But add the following to your CSS and adjust the values.

    .comment-meta { {
    margin-top: 12px;
    }
    
    .comment-content p {
    margin-top: 12px;
    margin-bottom: 12px;
    }

    With the following you can adjust the space below the bottom content.

    h3#reply-title }
    margin-top: 20px !important;
    }
  5. You've been very helpful, I tried testing and previewing the code (above), after I save it, some of the items disappear, not sure why, what I'm left with is:

    .comment,.pingback {
    margin-top:0;
    }

    .comment-content p {
    margin-top:12px;
    margin-bottom:4px;
    }

    It also seems that the block with the name and date is the component that determines the row height, rather than the text itself.

  6. I just noticed I have an extra space and curly bracket on the first bit of code. Take that out as that is probably what was making things disappear.

    .comment-meta {
    margin-top: 12px;
    }

    What you will find is that you need to work all three of them together to keep thing aligned if you tighten things up past a certain point (the username will not align horizontally with the top line of text in the comment sort of thing). It will just depend on how much you tighten things up.

  7. I spotted a reversed curly bracket in the H3 snip above too. With experimentation, this is the end result, a lot less white space, but this is to allow for a considerable number of entries on the one page. Many many thanks Mr Path.

    .comment,.pingback {
    margin-top:0;
    }

    .comment-content p {
    margin-top:1px;
    margin-bottom:0;
    }

    .comment-meta {
    margin-top:1px;
    }

    h3#reply-title {
    margin-top:4px!important;
    }

    .comment-date {
    margin-bottom:4px;
    }

  8. You are welcome and sorry about my poor checking and editing, but glad you got it worked out. It looks good. The spacing is a little tight for my taste, but that's me. :-)

Topic Closed

This topic has been closed to new replies.

About this Topic