45

TL;DR: Headings currently have a CSS margin-bottom value, but not a margin-top value resulting in a distance to the following paragraph. I propose to add a margin-top and reduce the margin-bottom of headings.

Example picture (current situation): On the left a screenshot of an answer with a heading (level 2), on the right backgrounds added for visualization.

Example visualization of margin

Example picture (with proposed margins): Same text but with the margin-top set to 1em and the margin-bottom reduced to 0.3em. Notice how the heading seems to be attached to the following paragraph instead of the previous one.

Example visualization of proposed change


Long story: For context, I recently gave a longer answer with multiple headings and subheadings. I noticed that the margin on headings looks odd as they seem to be attached to the previous paragraphs instead of the following one.

After checking the CSS I found out, that the value of the margin-bottom is set to 1em, resulting in a distance of 21px to the bottom for level 1 headings while they have a distance of 15px to the previous paragraph. In my opinion, a margin-top should be added and the margin-bottom should be reduced to improve the readability.


More text examples of all heading levels. All headings have a distance of 15px to the previous paragraph.

Paragraph with text.

Heading, level 1, 21px margin bottom

Paragraph with text.

Heading, level 2, 19px margin bottom

Paragraph with text.

Heading, level 3, 17px margin bottom

Paragraph with text.

4
  • 12
    Good suggestion, your proposed change makes the structure much clearer. Commented Apr 9, 2019 at 18:17
  • I agree that it adds a good visual hierarchy to the text, making it clearer to discern what the heading is attached to.
    – erwstout
    Commented Apr 9, 2019 at 22:04
  • 4
    This was something that was annoying me yesterday. I resorted to just using bold formatting for headings with line breaks to add desired spacing above and below the text. Commented Apr 10, 2019 at 22:57
  • But nothing actually changed right? At least not on meta site? Commented Feb 25, 2022 at 3:41

0

You must log in to answer this question.

Browse other questions tagged .