Étranges lignes diagonales en Chrome/Chrome (bug?)
Lorsque j'utilise des filtres CSS, des ombres, des transformations, des SVG (ou similaires), mes Chrome/Chromium présentent une diagonale étrange:
filter:drop-shadow(0px 0px 10px #dce810);
transform:skew(-15deg);
Aucune erreur dans Firefox (Windows)/Canary Chrome 58. Erreur sur Chrome 56 et Chromium 58 (Windows).
Dans ce stylo, cette erreur se produit (à la fin, lors de l'activation du titre): https://codepen.io/manz/pen/jyYKJo }
Est-ce que quelqu'un sait s'il s'agit d'un bogue connu ou d'un problème qui est résolu en désactivant une option?
Il s'agit presque certainement de ce bogue de rastérisation Chrome/Chromium, qui semble être spécifique à certains GPU NVidia:
Numéro 691262 Arrière-plan corrompu avec le rasterisation GPU .
Comme indiqué ci-dessus, il s'agit d'un problème de GPU, mais la solution de contournement temporaire fonctionne très bien pour moi:
div {
position: relative;
z-index: 0;
}
div:before {
content: '';
display: block;
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
z-index: -1;
background: inherit;
}