301871 2025-11-03 10:19:30 -0800 CSS Container Style Queries: fails when container has display: contents 2026-05-21 09:55:54 -0700 1 1 1 Unclassified WebKit CSS Safari 26 Unspecified Unspecified RESOLVED FIXED https://bugs.webkit.org/show_bug.cgi?id=306237 https://github.com/web-platform-tests/wpt/pull/60070 InRadar P2 Normal --- 1 steveorvell ahmad.saleem792 joel karlcow kobiz koivisto maggotfish simon.fraser webkit-bug-importer zalan oldest_to_newest 2156014 0 477264 steveorvell 2025-11-03 10:19:30 -0800 Created attachment 477264 container style query with display contents Given the following setup: 1. a container defines a CSS custom property and has `display: contents` 2. a style query uses the custom property to apply a property to a contained element 3. the contained element changes styling dynamically, e.g. via a :hover rule applying Expected: the contained element maintains the property set via the container style query. Actual: the contained element loses the property set via the container style query. 2156015 1 steveorvell 2025-11-03 10:20:38 -0800 Reproduction: https://lit.dev/playground/#gist=e84af8138bb40c026ad3806be64ee227 2157702 2 webkit-bug-importer 2025-11-10 10:20:13 -0800 <rdar://problem/164414720> 2158456 3 maggotfish 2025-11-12 23:03:14 -0800 This is also affecting us at Wix with future stuff we want to build, not really affecting current sites, but it's blocking us. 2158458 4 karlcow 2025-11-12 23:24:01 -0800 Thanks Steve and Yehonatan I can reproduce the issue on latest Safari and STP 231. The second block loose the background-color after the hover. 2163955 5 kobiz 2025-12-07 03:58:38 -0800 *** Bug 303703 has been marked as a duplicate of this bug. *** 2210133 6 joel 2026-05-12 07:43:30 -0700 I found a workaround. If you set a property when interacting with an element inside the `display: contents` element, it seems to sufficiently force Safari to apply the container query again. .contents { display: contents; --contents-cache-key: 0; &:has(:hover) { --contents-cache-key: 0; } &:has(:focus-within) { --contents-cache-key: 0; } &:has(:active) { --contents-cache-key: 0; } } 2211591 7 ahmad.saleem792 2026-05-17 18:59:14 -0700 Pull request: https://github.com/WebKit/WebKit/pull/65081 2212978 8 ews-feeder 2026-05-21 09:46:27 -0700 Committed 313677@main (93785137d0d1): <https://commits.webkit.org/313677@main> Reviewed commits have been landed. Closing PR #65081 and removing active labels. 477264 2025-11-03 10:19:30 -0800 2025-11-03 10:19:30 -0800 container style query with display contents file_301871.txt text/plain 317 steveorvell PHN0eWxlPg0KICAudGVzdDpob3ZlciB7DQogICAgb3V0bGluZTogMXB4IHNvbGlkOw0KICB9DQog IEBjb250YWluZXIgc3R5bGUoLS1ncmVlbikgew0KICAgIC50ZXN0IHsNCiAgICAgIGJhY2tncm91 bmQ6IHBhbGVncmVlbjsNCiAgICB9DQogIH0NCjwvc3R5bGU+DQo8ZGl2IHN0eWxlPSItLWdyZWVu OiA7Ij4NCiAgPGRpdiBjbGFzcz0idGVzdCI+aG92ZXIgbWU8L2Rpdj4NCjwvZGl2Pg0KPGJyPg0K PGRpdiBzdHlsZT0iLS1ncmVlbjogOyBkaXNwbGF5OiBjb250ZW50czsiPg0KICA8ZGl2IGNsYXNz PSJ0ZXN0Ij5ob3ZlciBtZTwvZGl2Pg0KPC9kaXY+DQo=