Page MenuHomePhabricator

[Bug] Bottom margin on lists in Minerva are too short
Closed, DuplicatePublic3 Estimated Story PointsBUG REPORT


Steps to reproduce

Go to
Scroll to Ecology > Range

Expected results

Margins above and below the list should be equivalent.

Actual results

Screenshot 2024-02-29 at 1.37.20 PM.png (888×2 px, 361 KB)

Bottom margin is too short.

It seems to have something to do with:

.content li:last-child {
    margin-bottom: inherit;

I'm not sure where it's inheriting that 0px bottom-margin from, but if the margin-bottom is set to 16px the correct behaviour is present.

QA Results - Prod


Event Timeline

KSarabia-WMF set the point value for this task to 3.Mar 14 2024, 5:00 PM

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

[mediawiki/skins/MinervaNeue@master] Update padding on <p> elements

Test wiki created on Patch demo by BWang (WMF) using patch(es) linked to this task:

@JScherer-WMF I put together these patch demo links for you to review. I basically used the same fix as in Vector, where now <p> elements have .5em spacing on top and bottom, but using a mix of margin and padding so that adjacent <p> elements still have a total of 1em spacing. However just like in Vector, this impacts spacing of text overall because the <p> element is used next to so many different elements. Please take a look and let me know if its ok

bwang removed JScherer-WMF as the assignee of this task.
bwang subscribed.

@bwang Sorry for the delay in replying to this ticket. I'm not sure if this is one of the tradeoffs you mention above, but the subheading directly after a list doesn't have enough vertical spacing.

Screenshot 2024-03-25 at 10.13.11 AM.png (880×1 px, 161 KB)

I merged the other vertical spacing tasks in T360917. Left this one because it's already in progress.

Change #1012422 merged by jenkins-bot:

[mediawiki/skins/MinervaNeue@master] Update padding on <p> elements

Edtadros subscribed.

Test Result - Prod

Status: ✅ PASS
Environment: enwiki
OS: macOS Sonoma
Browser: Chrome
Device: MBA
Emulated Device:NA

Test Artifact(s):

QA Steps

Go to
Scroll to Ecology > Range
✅ AC1: Margins above and below the list should be equivalent.

screenshot 175.png (1×1 px, 433 KB)

screenshot 176.png (1×1 px, 450 KB)

screenshot 174.png (1×1 px, 448 KB)