Bonjour,

Je débute dans l'utilisation des Media Queries.

Je développe un site web en utilisant la méthode "Mobile First".

Seulement voilà, j'ai du mal à comprendre le principe.

Voici un bout de code:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
.newsImg {
	width: 50%;	
	margin-left: auto;
	margin-right: auto;
}
 
@media only screen and (min-width: 768px) {
	.newsImg img {
		width: 30%;
	}
}
@media only screen and (min-width: 992px) {
	.newsImg img {
		width: 10%;
	}
}
En principe, cela signifie que la largeur de mon image sera de 10% sur un écran de largeur supérieure ou égale à 992px, 30% sur un écran de largeur supérieure ou égale à 768px et 50% sur les écrans plus petits.

Hors, dans mon CSS, je me retrouve avec une largeur de 30% (pour écran supérieur ou égal à 768px), pour un écran de 375x667.

Quelqu'un peut-il, s'il vous plaît me venir en aide et m'expliquer ceci plus clairement ?