RESOLVED DUPLICATE of bug 250293 251078
REGRESSION (STP 160): tweakers.net media queries not applied correctly
https://bugs.webkit.org/show_bug.cgi?id=251078
Summary REGRESSION (STP 160): tweakers.net media queries not applied correctly
Gustaaf Groenendaal
Reported 2023-01-24 01:56:23 PST
Created attachment 464626 [details] Possible reduction with html and (responsive) css files Before testing please make sure you have a window with a horizontal resolution of at least 768px, 1280+ preferable and make sure the window's width is bigger than it's height. As per Safari Technology Preview 160 (and 161) on Monterey (12.6.2) the site https://tweakers.net applies media queries incorrectly (you can see it in the header when comparing the site to shipping Safari at the same window resolutionnn). The media queries for < 767px are always applied for some reason. Tweakers.net is applying stylesheets based on media-queries defined in the <link>-element in the header. Shipping Safari does load all the stylesheets even if they don't apply, but doesn't apply stylesheets that don't match the media query as in TP 160+. I made a reduction, but that doesn't fail like Tweakers.net. So it's likely something is interfering, but I haven't found the reason yet.
Attachments
Possible reduction with html and (responsive) css files (3.85 KB, application/zip)
2023-01-24 01:56 PST, Gustaaf Groenendaal
no flags
Working reduction (4.02 KB, application/zip)
2023-01-25 05:21 PST, Gustaaf Groenendaal
no flags
Radar WebKit Bug Importer
Comment 1 2023-01-24 18:54:37 PST
Gustaaf Groenendaal
Comment 2 2023-01-25 05:21:00 PST
Created attachment 464646 [details] Working reduction Did some digging and found the problem. There is a media query inside the linked CSS file that overwrites the file's main media query. The contents of that media query are ignored and instead the CSS below that media query is applied as if the media query inside the stylesheet is the only one. Even though this might not be correct spec-wise, it shouldn't break applying the main media query. The media query inside the external file with a media query applied should either be discarded OR applied as a sub media query in Safari <=16.3. I think this is broken since https://commits.webkit.org/257252@main but the original error might've been introduced earlier.
Antti Koivisto
Comment 3 2023-01-25 08:14:52 PST
This was fixed in <https://commits.webkit.org/258732@main> *** This bug has been marked as a duplicate of bug 250293 ***
Note You need to log in before you can comment on or make changes to this bug.