Bonjour, Bonsoir

J'ai un petit problème je vous explique :

Je suis en train de réaliser un projet et j'ai un problème au niveau du responsive, ma navbar est de couleur black (exemple) et je voudrais la faire passer en rouge quand la taille de l'écran descent de 500px alors je fait :

@media(max-width:500px){
nav {
background-color: red;
width: 100%;
height: 75px;
}
}

mais le problème sais que sa ne marche pas je suis obliger de mettre

@media(max-width:500px){
nav {
background-color: red!important;
width: 100%;
height: 75px;
}
}

!important presque partout color padding width tout vraiment tout et je suis comprend pas merci

3 réponses


Salut
Pourrais tu nous donner le css complet de nav en dehors de @media(max-width:500px)?

Salut,

Utilises la balise code stp car là c'est illisible.

@media screen and (max-width: 500px) {
  nav {
    background-color: red;
    width: 100%;
    height: 75px;
  }
}

Si tu es obligé d'ajouter un !important, c'est sûrement que ton background est mieux défini dans une de tes règles css.
Inspecte et regarde quelle valeur est priorisé.