Inconsistent margins on headings
H2 heading, first in this RTE
Some paragraph content. The heading above has no top margin because of this CSS:
.section .wysiwyg:first-child .fr-view:first-child h2:first-child
H3 heading, second in this RTE
And some more content. This heading has a top margin because it is not the first heading
H3 heading, third heading in this RTE
And some more content. This heading also has a top margin because it is not the first heading in this RTE.
H2 heading - first heading in this RTE (first RTE in section)
.section .wysiwyg:first-child .fr-view:first-child h2:first-child
The selector only removes the top margin from an <h2> when it is the first heading in the first .wysiwyg component within a .section. If a section contains multiple .wysiwyg components, the first heading in any subsequent .wysiwyg doesn't match the selector, so it retains its default top margin. This creates inconsistent vertical spacing between WYSIWYG components in the same section. See below
Please note that all headings (H2,3,4,5,6) etc are affected by this rule, which looks like this in full:
.section .wysiwyg:first-child .fr-view:first-child h1:first-child,
.section .wysiwyg:first-child .fr-view:first-child h2:first-child,
.section .wysiwyg:first-child .fr-view:first-child h3:first-child,
.section .wysiwyg:first-child .fr-view:first-child h4:first-child,
.section .wysiwyg:first-child .fr-view:first-child h5:first-child,
.section .wysiwyg:first-child .fr-view:first-child h6:first-child {margin-top: 0;}
H2 heading - first heading in this RTE (second RTE in section)
This heading has a top margin, causing it to look inconsistent with the first RTE block.
H2 heading - first heading in this RTE (third RTE in section)
This heading has a top margin, causing it to look inconsistent with the first RTE block.