Issue #2862 resolved

issue tracker css: heading margins backwards (BB-2093)

Aryeh Leib Taurog
created an issue

== Steps to reproduce Create a bug with successive H2 + body text elements (like this one)

== Desired behavior H2 elements should visually delineate the distinct sections. That is, while there may be more vertical space between the h2 element and the text that follows it than between lines of body text, there should certainly be more space above the h2 element to set it off from the preceding section than there is below it.

== Observed behavior The h2 element has no space above it and quite a lot below it. Visually it appears to be grouped with the previous body text, not the text which follows.

== Further diagnosis The problem is really that the <p> element has {margin-top: 1em}

I suggest that <p> should be {margin-bottom: 1em} instead. Or perhaps you could add hx + p {margin-top: 0} rules for each heading level. Also, margin-top for all heading levels should be at least as much as, and preferably more than, its corresponding margin-bottom.

Comments (4)

  1. Aryeh Leib Taurog reporter

    By the way, the css applied in the preview is a little bit better, since the heading elements there have {margin-top: 12px}. However, that is limited to #preview and .comment (which I haven't seen yet). In any case, my suggestions would be an improvement on that as well.

  2. David Chambers

    Thanks very much for the bug report, Aryeh. The issue tracker's CSS currently provides extremely bad defaults for many elements. Significant improvements in this area are definitely on the cards, but I can't provide a timeframe at this stage.

  3. Log in to comment