The items from the ordered/unordered lists are misaligned on developers.pinterest.com
Categories
(Web Compatibility :: Site Reports, defect, P2)
Tracking
(firefox122 affected, firefox124 affected)
People
(Reporter: ctanase, Unassigned)
References
(Depends on 1 open bug, )
Details
(Keywords: webcompat:needs-sitepatch, webcompat:platform-bug, webcompat:site-report)
User Story
platform:windows,mac,linux,android impact:significant-visual configuration:general affects:all branch:release diagnosis-team:layout
Attachments
(1 file)
|
158.56 KB,
image/png
|
Details |
lists Firefox vs Chrome.png
Environment:
Operating system: Windows 10
Firefox version: Nightly 124.0a1 (2024-02-11)
Steps to reproduce:
- Go to https://developers.pinterest.com/docs/add-ons/about-addons
- Scroll down the page.
- Observe the lists.
Expected Behaviour:
The items from the lists are aligned correctly.
Actual Behaviour:
The items from the lists are misaligned.
Notes:
- Screenshot attached
- Reproducible on Firefox Release as well
- Not reproducible on Chrome
- Issue found during WebCompat team [Top100] websites testing
|
||
Updated•7 months ago
|
|
||
Updated•3 months ago
|
|
||
Comment 1•3 days ago
|
||
Here's a reduced test-case:
data:text/html,<!DOCTYPE html><ul><li><span><div>Update your JavaScript
It looks like with the standards doctype, Firefox adds an extra line-break, padding, or some other space, while Chrome does not. It also seems related to the nested div in the span, as if I drop either of those tags, the space also goes way.
I'm unsure if there's a way to site-patch this, so I'll drop that keyword for now.
|
||
Comment 2•3 days ago
|
||
I spun off bug 1918740 for the platform bug here.
|
||
Comment 3•3 days ago
|
||
Sitepatch could be something like :where(.MlF) { display: block; } or so.
|
|
||
Comment 4•3 days ago
|
||
Thanks Emilio! That does seem to work. We may also want to make it not rely on the specific class, in case the site updates, but that might be overkill (for instance li > span:has(>div) { display:block; })
Description
•