:has伪选择器传入元素列表不生效的问题求助

我最近碰到一个CSS :has伪选择器的奇怪问题，折腾了半天没搞明白，来求助各位大佬！

我的页面结构是这样的：一个带help-section类的section容器里，有个带help-image类的div，这个div里面包含了<img>元素（另外还有可能嵌套figure或者button元素）。

我一开始用这种拆分写法的时候，样式是正常生效的，目标div能正确显示mistyrose背景：

section.help-section > div:has(img),
section.help-section > div:has(figure),
section.help-section > div:has(button)
{
    background: mistyrose;
}

但按照MDN文档里的说明，我尝试把多个选择器放到同一个:has()括号里，写成下面这种简洁形式的时候，完全没效果——连开发者工具的样式面板里都看不到这条规则：

section.help-section > div:has(img, button, figure)
{
    background: mistyrose;
}

我已经反复检查过页面元素结构了，完全符合预期，但就是找不到第二种写法失效的原因，有没有大佬遇到过类似的问题，或者能帮我排查一下？

备注：内容来源于stack exchange，提问作者alexjfox