CSS élément de code en rouge pourquoi ? Fermé

Question

Bonjour,

Je rencontre un problème dans mon code de CSS lorsque je souhaite insérer : mix-blend-mode il devient rouge indiquant comme une erreur pouvez vous m'aidez à comprendre ce qui ne va pas et comment résoudre cela ?

merci d'avance

*, ::before, ::after{
    margin: 0;
    padding: 0;
    box-sizing: border-box; 
}
body{
    overflow-x: hidden;
    background: #000;
    min-height: 200vh;
    display: flex;
    cursor: none;
}
/*cursor animation*/
.cursor{
    position: fixed;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #fff;
    transition: 0.1s;
    transform: translate(-50%,-50%);
    pointer-events: none;
    mix-blend-mode: difference;
    z-index: 98;
}
body:hover ~ .cursor{
    transform: scale(6);
}

Windows / Chrome 103.0.0.0

jordane45 · Answer

Bonjour

Il devient rouge.... Dans ton éditeur de code... Ça veut juste dire que ton éditeur de code ne connais pas cette fonctionnalité... Après... Tant que ça fonctionne sur le navigateur internet il n'y a aucun souci.

LuDx24 · Answer

Bonjour oui c’est ça mais pourtant mon éditeur de code qui est Brackets le propose car quand je commence à taper le code il est en rouge mais il a l’air de fonctionner mais sur tout les code CSS que j’ai rentré c’est le seul comme ça.

j’ai testé chaque élément de CSS en supprimant absolument toute fonction autour l’histoire d’un instant pour voir si c’était une autre fonctionnalité qui n’était pas compatible ou si j’avais dû oublié des {} ou des () mais ça a l’air d’avoir aucun rapport.

je suppose que c’est parce que la fonction doit peut-être avoir un parent ou quoi pour fonctionner mais je ne sais pas quoi et ni si c’est ça mon problème cela serait plus simple si mon éditeur m’expliquait ce qui ne va pas.

Cela doit avoir un rapport avec le fait que la fonction :

body:hover ~ .cursor{
    transform: scale(6);
}

Ne fonctionne pas comme prévu car je devrais avec ce code avoir un curseur qui s’anime à chaque fois que je passe mon curseur sur des éléments de ma page or il ne s’anime pas mais bizarre la fonction en rouge a l’air de fonctionner malgré ça.

LuDx24 · Answer

Peut-être pourtant j’ai vu cette fonction fonctionner correctement dans un tutoriel je pense que ça doit venir de mon code.

CSS élément de code en rouge pourquoi ?

3 réponses

Discussions similaires