CSS + Media Queries [Résolu/Fermé]

Signaler
-
 Julie -
Bonjour,


Je souhaite utiliser les Media Queries sur mon site web afin de faire disparaître une image sur les écrans de smartphone :

Voici mon site : https://www.paca-decouverte.fr/

Comme vous pouvez voir, en dessous des miniatures des départements, j'ai une grand image d'un pont, et cette dernière est toute moche sur un smartphone, et du coup j'aimerais qu'elle disparaisse sur ces appareils...

J'ai testé ceci :


@media screen and (max-width: 1280px) {
.j-module n j-htmlCode {display:none;}
#cc-m-6780025062 {display:none !important;}
}


Mais cela ne fonctionne pas...

J'ai également essayé
@media all and (min-device-width: 1280px)
qui fonctionne autre part dans mon code pour une autre propriété, mais cela ne fonctionne pas non plus, du coup j'aimerais votre aide pour me dire ce qui ne va pas dans mon code et pourquoi ???

Cordialement.

2 réponses

Messages postés
2370
Date d'inscription
lundi 11 février 2013
Statut
Membre
Dernière intervention
10 mars 2020
432
Salut,

Le code de ton message est bon mais tu as une erreur de syntaxe dans ton css quelques lignes plus haut : tu as un "*/" tout seul à la fin de la ligne /*icône accueil*/ ce qui empêche le navigateur de lire correctement la règle css suivante, en l’occurrence la media query.

/*icône accueil*/  li#cc-nav-view-1198998562 a { background: url("https://image.jimcdn.com/app/cms/image/transf/dimension=40x40:mode=crop:format=png/path/s720532a5ff7f8ce4/image/i76293b44f7a48dae/version/1495961385/image.png") no-repeat scroll right top transparent; background-color: #eee ; background-position: 2px 0px; padding-left: 40px !important;} */

/*@media all and (min-device-width: 1280px) {*/
@media screen and (max-width: 1280px) {
    .j-module n j-htmlCode  {display:none;}
    #cc-m-6780025062 {display:none !important;}
}


A corriger en
/*icône accueil*/  li#cc-nav-view-1198998562 a { background: url("https://image.jimcdn.com/app/cms/image/transf/dimension=40x40:mode=crop:format=png/path/s720532a5ff7f8ce4/image/i76293b44f7a48dae/version/1495961385/image.png") no-repeat scroll right top transparent; background-color: #eee ; background-position: 2px 0px; padding-left: 40px !important;}

/*@media all and (min-device-width: 1280px) {*/
@media screen and (max-width: 1280px) {
    .j-module n j-htmlCode  {display:none;}
    #cc-m-6780025062 {display:none !important;}
}


Bonne journée,
Salut,

...Oooops je ne sais pas ce qu'il foutait là ! Merci énormément c'était bien ça qui faisait tout foirer :o

Haha j'ai limite honte que c'était si simple à régler !

Merci bien

Bonne journée ;)
Julie