search

GoogleChromeLabs / container-query-polyfill

A polyfill for CSS Container Queries
https://npm.im/container-query-polyfill
Apache License 2.0
1.13k stars 50 forks source link

safari14 version issue #80

Open JuSeonmi opened 9 months ago

JuSeonmi commented 9 months ago

hi, I am a UI developer who really wants to apply polyfill to the service. 😀 I confirmed that it applies well up to version 15, but it is a problem in version 14. In Safari14 version, the data-cqc-* attribute is not created, so the style of :where([cqc~**]) does not seem to be matched and applied properly. It appears that all declared @container styles are displayed. Is this working properly? Please confirm.

https://codepen.io/chriscoyier/full/yLzKavz

safari 15 스크린샷 2024-01-09 오후 7 54 46스크린샷 2024-01-09 오후 7 54 43

safari 14 스크린샷 2024-01-09 오후 7 54 23 스크린샷 2024-01-09 오후 7 54 21

iamallyniam commented 8 months ago

I have a similar issue in Safari 14, according to can i use Safari supports the where pseudo class from version 14 onwards, https://caniuse.com/?search=%3Awhere but I keep seeing :where pseudo class not supported in this browser.

colbat commented 7 months ago

Hi, I have the same issue. It seems to be similar to this one: https://github.com/GoogleChromeLabs/container-query-polyfill/issues/64 where the check for :where is not supported. For me that happens only on Safari iOS < 14.5.

I just opened a PR with a fix: https://github.com/GoogleChromeLabs/container-query-polyfill/pull/82