Forum : Probleme media queries

Bonjour,

Je suis entrain de mettre un site internet compatible responsible mais je me heurte à un petit probleme le voici :

Je voudrais afficher la bar de navigation normal quand on regarde le site avec un grand ecran et lorsqu'on regarde avec un ecran de telephone le nav bar de base disparait au profit d'un symbole qui fait apparaitre un menu quand on clique dessus, voici comme je m'y prend :

J'utilise des medias queries :

<i class="fa fa-bars fa-lg menu1"></i>

@media screen and (max-width: 765px)
{
.menu1 {
display: block;
    }
}

.menu1 {
display: none;
position: fixed;
right: 12%;
top: 2.8%;
}

Mais j'ai un petit probleme c'est que mon symbole de menu ne disparait pas meme si je met display:none.

Merci d'avance,

Cordialement,

3 réponses

Antoine Courtin

Réponse acceptée

Hello,

C'est sûrement une question de priorité de règle essaye en mettant : display : none !important

Supa polo

Auteur

Merci je connaissais pas , en tout cas ca marche !

nico41

Bonjour,

Si je peux me permettre, je pense que ton problème vient de l'ordre des règles css,

inverse les simplement et je pense qu'il n'y aura pas besoin de !important

.menu1 {
display: none;
position: fixed;
right: 12%;
top: 2.8%;
}

@media screen and (max-width: 765px)
{
.menu1 {
display: block;
    }
}