[Résolu] Icone menu responsive

Bonjour à tous.
dans le but de faire une icone menu responsive , j'ai fait une icone
et j'ai uilisé @media , normalement au dela de 900 px l'icone ne devrait plus apparaître , mais avec chrome du texte apparait encore.
voici le code.

<span class="burger">&#9776;&nbsp;Menu</span>

en css

@media (min-width: 300px) and (max-width: 900px) { 
.burger{
color:black;
font-size:1.5em;
background-color:yellow;
margin-left: 20px;
cursor: pointer;
}
}

il doit manquer qq chose dans les règles css, je suppose.
Merci de votre aide

Salut,
là tu nous montres un media-query mais dans ton css as-tu mis des propriétés pour la classe burger ?
Autre chose, au delà de 900px (et aussi au-dessous de 300px vu ton code) tu veux faire disparaitre uniquement le burger ou aussi le mot menu ?

Bien je voudrais aussi faire disparaître le mot menu.
en fait j'ai essayé de mettre dans la css générale ceci

.burger{
display: none;
}

mais dans ce cas icone et texte disparaissent même avec media query.
Comme je voudrais faire 2 styles, un de 300 px à 900px et un autre de 901 px à 1300 px.
; j'ai essayé de mettre un autre media query et on dirait que ça marche le burger disparait entre 901 px et 1300 px

@media (min-width: 901px) and (max-width: 1300px) { 

.burger{
display: none;
}
}

je sais pas si c'est bien dans les règles de l'art.
en tous cas je voudrais que mes pages fassent 300 px au plus petit et 1300 px au plus grand pour une raison de cohérence .
merci
Modifié par edgard03 (29 May 2021 - 16:23)

Pour que tes pages fassent 1300px maximum il faut indiquer

max-width: 1300px;

dans la balise body du fichier css général.

Du coup dans ton media-query tu n'as plus besoin de "and (max-width: 1300px)".

Ensuite tu n'as pas besoin de spécifier de display pour ton burger dans ton css général. Par contre dans ton media-query tu mets "display: none;" comme tu as fait et c'est bon. Tu peux aussi essayer la propriété "visibility: hidden;".

Normalement tu devrais obtenir ce que tu cherches.

ok merci pour tes explications.
edgard