Combinaison de plusieurs conditions dans les requêtes multimédia CSS avec la logique OU

Dans les requêtes multimédia CSS, spécifier plusieurs conditions à l'aide de la logique « OU » peut être utile pour cibler des appareils avec des tailles ou des aspects d'écran différents. Bien que le code fourni dans la question soit incorrect, il existe une méthode simple pour obtenir le résultat souhaité.

Pour spécifier plusieurs conditions avec la logique « OU », séparez-les par des virgules :

@media screen and (max-width: 995px), screen and (max-height: 700px) {
  ...
}

Comme expliqué dans la documentation sur https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries:

"Les virgules sont utilisées pour combiner plusieurs requêtes multimédias en une seule règle. Chaque requête dans une liste séparée par des virgules est traitée séparément des autres. Ainsi, si l'une des requêtes d'une liste est vraie, l'ensemble du média. L'instruction renvoie true. En d'autres termes, les listes se comportent comme un opérateur logique ou. "

En utilisant cette approche, la requête multimédia vérifie si la largeur de l'écran est inférieure ou égale à 995 pixels ou si la hauteur de l'écran est inférieure. supérieure ou égale à 700 pixels. Si l'une ou l'autre des conditions est remplie, les styles spécifiés dans la requête multimédia seront appliqués.