Safari 14 - CSS rendering issues related to background gradients, background-attachment, mix-blend-mode

北城以北 提交于 2021-01-29 05:48:01

问题


My question is how to fix rendering issues in Safari 14 related to a combination of multiple background gradients (linear and radial), background-attachment (local and scroll) and ``mix-blend-mode`.

Please see example: https://codepen.io/astro87/pen/LYRQNbd?editors=1100

Correct rendering in Google Chrome

Background gradient visible on the right edge:

Scroll a bit to the right and see background gradient is visible on the left and right edge:

Scroll completely to the right edge and see background gradient is visible on the left edge:

Incorrect rendering in Safari 14

Background gradient is scattered:

来源:https://stackoverflow.com/questions/65579192/safari-14-css-rendering-issues-related-to-background-gradients-background-att

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!