英文:
-webkit-mask-box-image showing the masking image in sets of 4
问题
I'm having issues with -webkit-mask-box-image在我的应用程序上显示4组遮罩图像。这最近在Safari上开始出现，而在Chrome上没有发生。任何帮助将不胜感激。
.fhr {
--fhr-icon-size: 20px;
&-shopping-bag {
-webkit-mask-box-image: url("/icons/shopping-bag.svg");
}
background: var(--layout-color);
height: var(--fhr-icon-size);
width: var(--fhr-icon-size);
}
英文:
I'm having issues with -webkit-mask-box-image showing the masking image in sets of 4 on my application. This started recently on Safari and doesn't happen on Chrome. Any help would be appreciated.
.fhr {
--fhr-icon-size: 20px;
&-shopping-bag {
-webkit-mask-box-image: url("/icons/shopping-bag.svg");
}
background: var(--layout-color);
height: var(--fhr-icon-size);
width: var(--fhr-icon-size);
}
答案1
得分: 2
Here is the translated content:
嘿，我遇到了与你相同的问题，就像那样一直重复。在我的搜索中，我找不到任何有用的东西，感觉就像我是唯一遇到这个问题的人。
这是我找到的链接：https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-mask-box-image，看起来我们正在尝试使用一个缩写，而Safari似乎不喜欢它。
为了解决这个问题，我在我的应用程序中用“-webkit-mask-box-image”替换为“-webkit-mask-box-image-source”，对我来说似乎解决了问题。希望对你有所帮助，祝你编码顺利！
英文:
Hey I was running into the same issue where it was just repeating like that. I couldn't find anything useful on during my searches and it felt like I was the only one running into the issue.
Here is a link I found https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-mask-box-image it appears that we are trying to do a short hand and safari doesn't like it.
To resolve it on my app I replaced -webkit-mask-box-image with -webkit-mask-box-image-source and that seemed to fix it for me. I hope that helps you, and good luck coding!
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论