Exaggerated empty space between post text and comments

If you install Firefox Firebug then when you visit your website you can immediately see the css styling plus line numbers for that post text and Comments

OK, I installed Firebug; there is quite a long list of strings in CSS. What should I look for to edit the space between text and commnents?

Hi

start firebug

click second button on left … blue box and arrow

hover over comments and text; its corresponding css will be shown at bottom right

There you will see css spacing done

I did as you say, Firebug opens an HTML tag.
When I hover over the white space, Firebug highlight a <div id="content"> section
screenshot

I mean, what kind of settings should I look for and modify?
thanks
Fabio

Hi 123milliseconds
did you see my last post?
Fabio

Your headings are large; columns of text cannot be narrower than wide long title words

style.css (line 117)

color: #8D3D0D;
font-size: 30px;
text-decoration: none;
text-transform: uppercase;
}

3px padding you added is a third of a character width

https://www.w3schools.com/css/css_padding.asp

https://www.w3schools.com/css/css_margin.asp

I really can’t find the line 117.
This is what the Firebug window is showing me, but as I browse line by line I can’t find the 117 in the right section
Screenshot

HI

See first screenshot here

https://csscreator.com/node/33530

You are somehow missing the part on right hand side; showing the css detail and line numbers

Hi
I do have that section, I just didn’t put it in the screenshot.
There is where I am not able to find the line 117, I have been looking all the sections on the left side and the correspondent codes on the right but I am unable to pick any line n.117.
Firebug screenshot

Sorry, I now see that should be posted to someone elses question here somewehre??; so ignore that.

style.css (line 391)

#respond {
margin-bottom: 22px;
overflow: hidden;
padding: 22px 0 0;
position: relative;
}

padding: 22px

reduce that to

padding: 2px

to reduce padding at top of post a comment

——

style.css (line 220)
.single #content {
margin-bottom: 66px;
}

reduce that 66 to a smaller number

—-

done !

Hi
I have done as you say and set codes this way
.single #content {margin-bottom:10px;} (tried before at 40 and 20)
#respond {margin-bottom:22px; overflow:hidden; padding:2px; position:relative}
but it doesn’t make any difference.

Hi, fabthi:
Not sure if you have this figured out yet, but the #content div includes the #respond div, so changing the margin of #content won’t make a difference. I still see 22px of padding at the top of respond, however, and when I set padding:0; for #respond in Firebug, it does move the #respond div up 22px as expected.
It looks fine to me either way, FWIW.

Hi John
yes I solved about this already, thanks.
Perhaps I have another issue that I posted in this thread that I haven’t resolved yet, maybe you know how to go through.
Fabio