#Media_Queries Range Syntax
▻https://ishadeed.com/article/range-syntax
/* Before */
.section {
@media (min-width: 300px) and (max-width: 500px) {
/* styles for the card */
}
}
/* After */
.section {
@media (300px <= width <= 500px) {
/* styles for the card */
}
}
#css
Merci !
Media queries are the backbone of responsive design. We use them to control how a design should change based on the viewport size. But the min-width and max-width syntax can be confusing, and in some cases, cause layout bugs that take time to spot.
This article aims to convince you to use range queries, starting today.
Ah ça y est, c’est enfin utilisable ? Quelle bonne nouvelle, ça va enfin devenir lisible tout ça, quel progrès.