Décrivez ici votre problème ou ce que vous cherchez à faire.

Entourez votre code en utilisant "```" pour bien le mettre en forme. (ne copiez pas trop de code)

"`
ul li a::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 50%;
background: black;
transition: .5s;
transform: scale(.9);
z-index: -1;
}

ul li a:hover::before {
transform: scale(1.1);
box-shadow: 0 0 15px #ffffff;
}

ul li a:hover {
color: #ffffff;
box-shadow: 0 0 5px #ffffff;
text-shadow: 0 0 5px #ffffff;
}

input:hover{ border-bottom: 0px; color: #00000;}

input:after {
content: "";
height: 100%;
left: 0;
top: 0;
width: 0px;
position: absolute;
transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
z-index: -1;
}

input:hover:after{ width: 100%; }

``"

je suis debutante et j'aimerais savoir s'il y a des erreurs sur mon code merci à tous

Ce que je veux

Décrivez ce que vous cherchez à obtenir.

Ce que j'obtiens

Décrivez vos éventuelles erreurs ou ce que vous obtenez à la place de ce que vous attendez :(

2 réponses


Hello :)

Déjà je reposte ton code en propre x)

ul li a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: black;
    transition: .5s;
    transform: scale(.9);
    z-index: -1;
}

ul li a:hover::before {
    transform: scale(1.1);
    box-shadow: 0 0 15px #ffffff;
}

ul li a:hover {
    color: #ffffff;
    box-shadow: 0 0 5px #ffffff;
    text-shadow: 0 0 5px #ffffff;
}

input:hover{
    border-bottom: 0px; color: #00000;
}

input:after {
    content: "";
    height: 100%;
    left: 0;
    top: 0;
    width: 0px;
    position: absolute;
    transition: all 0.3s ease 0s;
    -webkit-transition: all 0.3s ease 0s;
    z-index: -1;
}

input:hover:after{
    width: 100%;
}

Alors perso j'aurais placé ul li a:hover en première position, pas d'incidence technique mais c'est rangé :p

Sinon tout m'as l'air bon, il n'y a pas de probleme dans le visuel?