Archived topic
How to reduce space between post and "leave a comment"
9 replies · Started by Anonymous on August 10, 2016
Hi Tom,
ich want to reduce the space between a post's end and the line "leave a comment", to make it clear, that the comment's line belongs to the post above:
First I tried, to eliminate the paragraph's margin like this: p {margin-bottom: 0px;}.
That works fine, but than I run into another problem: To separate one paragraph from the next paragraph, I had to insert blank paragraphs, empty lines. Some programs like WordPress TinyMCE delete empty paragraphs automatically, because they weren't "correct" HTML.
Any suggestions, how I can push the comment's line closer to the post it belongs to?
Kind regards
Roland
I'm not quite sure if this is the correct/best CSS to use but it seems to work:
footer.entry-meta {
margin-top: -20px;
}Wouldn't something like this work?:
footer.entry-meta {
margin-top: 0;
}Negative values should be avoided if possible (but they aren't evil or anything).
That's the first thing I tried but it didn't seem to work for me in inspect element. Only moved it up a tiny little bit, almost unnoticeable..
Interesting, any other elements causing spacing you can see?
Don't think so unless I missed something. When I use the inspector before changing anything I could see the 2em margin-top color in orange. When I changed it to 0 the orange color is no longer there but the space seems to remain...
Hmm, I would have to see it. By default that shouldn't happen.
Is your blog content set to excerpt or full content?
Excerpt. and yea I can show you for sure!
Oh I see what's going on. The last paragraph in the excerpt has a margin-bottom.
Add this to your code and it should work:
.entry-summary p:last-child {
margin-bottom: 0;
}Thanks Tom :)
Quick summary for anyone who's reading this, the two CSS below are required to solve this puzzle:
.entry-summary p:last-child {
margin-bottom: 0;
}
footer.entry-meta {
margin-top: 0;
}