lien pas en ligne parce que dans son propre div?

Question

Les liens étaient tous alignés horizontalement jusqu'à ce que je mette l'un d'entre eux dans son propre div pour changer sa couleur quand je suis sur la page à laquelle il est lié.

Maintenant, je ne peux pas le faire revenir en ligne.

<div class="navigation"> 
    <a href="./productions.html">Mes productions</a> 
    <a href="./DJ.html">DJ</a> 
    <a target="_blank" href="./CV.pdf">Mon CV</a> 
    <div id="contact"> 
    <a href="./contact.html">Me contacter</a> 
    </div> 
</div> 

.navigation { 
    padding: 40px 0px; 
    position: relative; 
    text-align: center; 
    width: 100%; 
    font-size: 30px; 
} 

.navigation a { 
    background: black; 
    border: 1px solid grey; 
    border-radius: 7px; 
    color: white; 
    display: inline-block; 
    margin: 100px 35px; 
    padding: 14px; 
    text-decoration: none; 
    opacity: 0.75; 
    font-family: impact; 
} 

.navigation a:hover { 
    background: white; 
    border: 1px solid black; 
    color: black; 
} 

#contact a { 
    background: white !important; 
    color: black !important; 
    display: inline-block !important; 
} 

Answer 1

Vous devez définir display: inline-block sur #contact, non #contact a.