1485 sujets

Web Mobile et responsive web design

Salut à tous,
je suis actuellement en train de faire l aversion mobile de mon site web, mais j'ai un problème je n'arrive pas à passer de l'horizontal à la vertical lorsque l'on est sur un téléphone.

J'ai utilisé les display: flex, et dans le media le flex direction : column, mais ca ne marche toujours pas.

Je l'impression que le media ne veut même pas se "connecter" puisqu'il veut même pas changer la couleur d'un texte

Help me please !!

.concept__steps{
width: 100%;
display: flex;
justify-content: space-between;
margin-top: 40px;
}

@media only screen and (max-device-width:320px) {
.concept__steps{
flex-direction: column;
}
}
Modifié par alizee_gly (03 Oct 2019 - 11:59)
Administrateur
Bonjour,

Testes-tu sur un device faisant 320px de large ? Voir https://www.mydevice.io, un iPhone fait plutôt 375px maintenant…
est-ce que ta CSS est valide ? Est-ce que tu vois la propriété dans l'Inspecteur des Devtools ? Est-ce que la CSS dans l'onglet Éditeur de style (j'utilise Firefox) des Devtools correspond à ce que tu as écrit ?
Si tu ajoutes avant flex-direction un "background: pink;" est-ce qu'il est actif ?

Et enfin si tu remplaces cette MQ par @media (max-width: 767px) { } ? (ou 768 #çaDépend)
Administrateur
Autre question : as-tu bien une balise <meta> viewport pour modifier le viewport sur mobile (pour qu'il ne se considère pas comme grand écran) ?