Redimentionne image sur un smartphone [Fermé]

Signaler
-
Pitet
Messages postés
2379
Date d'inscription
lundi 11 février 2013
Statut
Membre
Dernière intervention
10 mars 2020
-
Bonjour,
Je viens vers vous car j'ai un petit problème;
Je n'arrive pas a faire que mon image soit redimensionné sur les téléphones, elle déborde de l'écran et cela est pas beau a voir.
J'ai essayé de me renseigne mais je n'arrive pas à toute comprendre. Voila ce que j'ai fait :
@media(max-width:320px){
.concours {
background-image: url(img/cms/concours.PNG)}
#main .concours{height:270px;}
#main .concours{height:120px;}
}


Je vous remercie pour votre attention

1 réponse

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

On recommande en général de commencer par définir le style pour la version mobile puis d'utiliser les médias queries pour définir le styles des résolutions plus grande (via min-width du coup).

Par exemple :
/* Par défaut (en mobile), on affiche l'image sur 120px */
#main .concours {
  background-image: url(img/cms/concours.PNG);
  height: 120px;
}

/* Pour les résolutions au dessus de 768px, on affiche l'image sur 270px */
@media(min-width: 768px) {
  #main .concours {
    height: 270px;
  }
}


Bonne journée,