[Bot]

Bonjour

Je desire realiser un effet de soulignement sous les liens de mon menu au hover.
le probleme est que l effet ne couvre pas uniquement le mot contenu dans le lien mais la cellule

ci dessus mon code css:

merci.

nav a{
        color: black;
        text-decoration: none;
        margin: 6px;
        width: calc(100%/5);
        padding: 3px  4px  3px  5px ;
        line-height:1;
        
        display: inline-block;
        }
        
        nav{
            margin-top: 9px;
            margin-right: 18px;
            
            position: relative;
            width: 40%;
            height: 75%;
           display: flex;
           justify-content: center;
           margin: auto 10px;
        }

a{
    position:relative;
}

a::after{
content:"";
position: absolute;
width: 0;
right: 0;
height: 1px;
background-color: black;
transition: width .5s ease-in-out;
bottom:-2px;


}

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

——————–
Pat66 – Envoyé depuis le Discord : Culte du code

Sujet

[Bot]

——————–
Pat66 – Envoyé depuis le Discord : Culte du code

[Bot]

c’est parce que tu dois pas le mettre que sur ton lien mais sur l’élément qui le contient je pense

——————–
DK – Envoyé depuis le Discord : Culte du code

[Bot]

indente mieux ton code aussi hein 😂

——————–
DK – Envoyé depuis le Discord : Culte du code

[Bot]

Sans l’HTML on sait pas à quoi tout correspond

——————–
DK – Envoyé depuis le Discord : Culte du code

[Bot]

Sinon utilise le pseudo element ::after comme t’as déjà fait, mais pour faire un border-bottom avec

——————–
DK – Envoyé depuis le Discord : Culte du code

[Bot]

    

        

            feldman

        
        

          Intro
          About
          Services
          Project
          Contact
           
        
        
           
   


           

  

        

          


  
 Design with the


future in mind.

            
        
            
          

        
    
    

03'

    

  
  

    


  

    
  

  

   
    
about feldman
 
    

        Lorem ipsum dolor sit amet consectetur adipisicing elit.  Accusantium expedita unde voluptatum alias mollitia eveniet molestiae perspiciatis eaque harum! Quo tempore iusto ab illo quisquam facilis nam nobis, porro eos. Lorem ipsum dolor sit amet consectetur adipisicing elit.  Accusantium expedita unde voluptatum alias mollitia eveniet molestiae perspiciatis eaque harum! Quo tempore iusto ab illo quisquam facilis nam nobis, porro eos. 

  


    

——————–
Pat66 – Envoyé depuis le Discord : Culte du code

[Auteur]

Réponses