Ошибка: фоновый фильтр в хроме делает непредубежный фон поверх размытого слоя-без дублированного DOM [закрыто] ⇐ CSS

[Anonymous]

Я использую фон-фильтр: размытый (...) эффект внутри фиксированного элемента (.menu-wrapper) для размытия фона, когда открыто полноэкранное меню. Очистите поверх него.
Но на другой подпадке, с точно такими же HTML и CSS, я вижу эту ошибку:
См. Здесь < /p>
Фон размыт, но неблочная версия фона появляется на верхней части размытия. Дублирование DOM не вовлечено. There are no z-index issues — .menu-wrapper is on top and blur is applied correctly.
What I’ve verified

[*]backdrop-filter is applied to .menu-wrapper and renders correctly

[*] В DOM < /p>
< /li>

< /br />

нет дублированных элементов. переполнение: скрыто от родительских элементов, которые изолировали бы контекст

Пробое было вынуждение композиции GPU с использованием Transform: transtatez (0), содержит: краска, изоляция: изолят и т. Д. /> < /li>
Пробовал отдельный размытый элемент в верхней части < /p>
< /li>
Пробовал удалить динамическое содержание Canvas или фоновый /> < /li>
< /ul>
Chrome-специфический < /strong> < /p>
Это происходит только в хроме (тестируется на последней версии на macOS). Firefox и Safari ведут себя правильно
, возможно, связанные факторы
Я использую WordPress с компонентной архитектурой (Flynt) и шаблонами Twig
hrome devtools «слоя». (композиция правильно). На подпадке: тот же элемент прозрачен
Какое вызывает это поведение наслоения в хром?

Подробнее здесь: https://stackoverflow.com/questions/796 ... blurred-la