www.laderexperten.se - Filters are misaligned
Categories
(Web Compatibility :: Site Reports, defect, P3)
Tracking
(Webcompat Priority:P3, Webcompat Score:3)
People
(Reporter: ctanase, Unassigned)
References
()
Details
(Keywords: webcompat:platform-bug, webcompat:site-report, Whiteboard: [webcompat-source:web-bugs])
User Story
platform:windows,mac,linux,android impact:significant-visual configuration:general affects:all branch:release diagnosis-team:layout user-impact-score:40
Attachments
(2 files)
image.png
Environment:
Operating system: Windows 10
Firefox version: Firefox 130.0/132
Steps to reproduce:
- Go to https://www.laderexperten.se/lader_vard/ladervardskit
- Apply any filters from the left side of the page.
- Observe the behavior.
Expected Behavior:
The filters are displayed correctly.
Actual Behavior:
Filters are misaligned.
Notes:
- Reproduces regardless of the status of ETP
- Reproduces in Firefox Nightly, and Firefox Release
- Does not reproduce in Chrome
Created from https://github.com/webcompat/web-bugs/issues/141832
|
Reporter | |
Comment 1•2 years ago
|
||
|
||
Updated•1 year ago
|
|
||
Comment 2•1 year ago
•
|
||
These checkbox-circle-things are all absolutely-positioned pseudo-elements, inside of a display:inline; position:relative containing block. We've got some known issues with having display:inline as an abspos containing block, mostly tracked as dependencies of bug 489100 (some of which are incremental/stateful-layout things like this bug seems to be -- e.g. bug 1918504).
|
|
||
Comment 3•1 year ago
|
||
For the record, here's a reduced testcase. Current actual-results for this:
- The initial layout has the checkbox-circle-things snap from a shifted-upwards wrong position to the right position.
- If I have devtools open, then they simply stay in the aforementioned shifted-upwards wrong position - this is presumably some layout statefulness caused by additional layout flushes in devtools.
- If I click the checkbox-circle-things, they sometimes jump to the shifted-upwards wrong position.
|
|
||
Comment 4•1 year ago
|
||
If I edit the testcase in devtools to tweak the span.checkbox { display:inline rule with s/inline/block/, then the issue goes away (and the layout changes slightly but not catastrophically). That's the wrapper-element that's serving as the abspos containing block for each of these checkboxes -- it has position:relative. So, that's what leads me to tie this to sharing an underlying cause with bug 1918504 (i.e. a dependency of bug 489100).
|
||
Updated•1 year ago
|
|
||
Updated•1 year ago
|
|
|
||
Updated•1 year ago
|
|
||
Comment 5•4 months ago
|
||
It appears the site may have changed, and I cannot reproduce the checkbox-circle jump bad behavior with testcase 1, regardless of whether layout.abspos.fragment-aware-inline-cb.enabled is true or false.
Daniel, are you still able to reproduce this bug?
|
|
||
Comment 6•4 months ago
|
||
I see the same thing that you describe (site seems to have changed, and the testcase doesn't rerpro the bug anymore either).
I can still repro the bug with the testcase in old builds from around when this was filed, though. Tracking down a fix-range.
|
|
||
Comment 7•4 months ago
•
|
||
Fix range (for attached testcase):
First good revision: 2db7b3567f798973dc712b7ec279c65002252f42 (2024-11-20)
Last bad revision: 3af3ec0d3d589a0cc5313c9f3139e73db0a5a91d (2024-11-19)
Pushlog:
https://hg.mozilla.org/mozilla-central/pushloghtml?fromchange=3af3ec0d3d589a0cc5313c9f3139e73db0a5a91d&tochange=2db7b3567f798973dc712b7ec279c65002252f42
In that range, I'm guessing this was a version of bug 1931466. Resolving as fixed by that bug.
|
||
Updated•4 months ago
|
|
||
Comment 8•3 months ago
|
||
Verified, the issue no longer reproduces.
Tested with:
- Browser / Version: Firefox 152.0-candidate build 1
- Operating System: Windows 10
Description
•