Change #1036715 had a related patch set uploaded (by Bernard Wang; author: Bernard Wang):

[mediawiki/skins/Vector@master] POC: Make paragraph spacing 0.5em top and 1em bottom by default, handle adjacent inline elements manually

https://gerrit.wikimedia.org/r/1036715

Just to double check, @JScherer-WMF these are the inline elements that were handled (ul, ol, table, dl, blockquote) to only have 0.5 top spacing when following a paragraph. Does this initial list of "inline elements" seem good to you? they can be adjusted in the future as well

i.e.

<p>paragraph</p>     
<--- 0.5em margin between paragraph and blockquote (not including spacing on the blockquote itself)
<blockquote>adjacent inline element</blockquote>
<--- 1em margin between paragraph and blockquote
<p>paragraph</p>

Change #1036715 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Make paragraph spacing 0.5em top and 1em bottom by default, handle adjacent inline elements manually

https://gerrit.wikimedia.org/r/1036715

Another problematic usecase we have on frwiki:

.col {
  margin-top: 0.3em;
  column-width: 30ex;
}
.col ul { margin-top: 0; }

<div class="col">
* list
* with
* several
* elements
* displayed
* in
* several
* columns
</div>

This example does not display consistently on Vector-2022 and Vector-legacy, since Vector-2022 already has margin-top: 0;

In T366389#9873928, @Pols12 wrote:

This example does not display consistently on Vector-2022 and Vector-legacy, since Vector-2022 already has margin-top: 0;

That will be removed after this patch goes live: https://gerrit.wikimedia.org/r/c/mediawiki/skins/Vector/+/1036715/3/resources/skins.vector.styles/typography.less.

In T366389#9873593, @Edtadros wrote:

5. Verify the inline element spacing next to paragraphs.
6. ❓ AC2: Confirm that inline elements next to paragraphs have 0.5em of spacing.

@bwang, This doesn't look right. What should I be looking for here?

Ah, this is a poorly worded requirement. That's the source of the confusion. The requirement should read: "Paragraphs with floated elements beside them always have at least 0.5em vertical spacing."

The issue before was that floated elements "stole" the vertical spacing from the paragraphs within which they appear. @bwang and I decided that the paragraphs should always have at least 0.5em spacing. If a floated element interacts with the end of a paragraph, that means that the spacing might get slightly larger. The spacing between the floated elements themselves is not the primary focus of this patch. Moving this to ready for sign off.

If we discover new, unintended vertical spacing behaviours, we should note them as separate bugs.

Thanks again @Jack_who_built_the_house and @bwang for your collaboration on this!

Test Result - PROD

Status: ✅ PASS
Environment: PROD
OS: macOS Sonoma 14.5
Browser: Chrome 126
Device: MBA
Emulated Device: NA

Test Artifact(s):

Test Steps

Test Case 1: Verify Paragraph and Inline Element Spacing in Vector 2022

1. Open the Vector 2022 skin.
2. Navigate to this patch demo page.
3. Verify the paragraph spacing.
4. ✅ AC1: Confirm that paragraphs have a margin-top of 0.5em and a margin-bottom of 1em.

5. Verify the inline element spacing next to paragraphs.
6. ✅ AC2: Confirm that inline elements next to paragraphs have 0.5em of spacing.