[Résolu] Responsive en utilisant les medias queries

Salut à tous,
j'ai un problème pour faire la version mobile de mon site web. Pour ça j'utilise les medias queries (ou plutôt j'essaye) mais j'ai un petit problème. Je n'arrive pas à "la connecter".

Pour l'instant je veux juste changer la couleur d'un titre mais lorsque je suis en mode mobile sur internet ça ne fonctionne pas.


Help please !!
Modifié par alizee_gly (01 Oct 2019 - 11:56)

Salut,

Ma boule de cristal étant cassée tu peux nous montrer ton code qui ne marche pas ?
Le reste du CSS marche ?

Désolé je croyais que la photo était passée

oui ça marche normalement c'est juste le css du mobile qui marche pas, je crois que j'ai pas bien noté le media

@media only screen and (max-device-width:480px) {
.presentation__title{
color: #FF625A;
}
}

.presentation__title{
font-weight: bold;
font-family: 'Montserrat';
color: #fff;
text-align: center;
margin: 0 auto;
width: 78%;
}

Bonjour,

Rien d'étonnant, vous définissez une règle contextualisée (480px de largeur max) puis une règle générale applicable en tout temps.

Faites donc l'inverse en appliquant un style général puis votre media-queries, vous constaterez le changement immédiat.

/* De manière générale, applique ces règles navigateur chéri */
.presentation__title{
font-weight: bold;
font-family: 'Montserrat';
color: #fff;
text-align: center;
margin: 0 auto;
width: 78%;
}

/* par contre tant que device-width est inférieur à 480px, fais ceci... */
@media only screen and (max-device-width:480px) {
.presentation__title{
color: #FF625A;
}
}

D'autre part pas sûr que max-device-width soit un choix pertinent. Perso je préfère bosser avec max-width, tout simplement.

Génial ça marche !!!!!

Merci beaucoup