Combinaison de requêtes média CSS

Je souhaite afficher le même ensemble de styles CSS pour les personnes qui impriment la page (media = print) et les personnes naviguant sur un téléphone mobile. Est-il possible de combiner les requêtes CSS?

Quelque chose comme

@media only print or @media only screen and (max-device-width: 480px) { #container { width: 480px; } } 

Séparez-les par une virgule:

 @media only print, only screen and (max-device-width: 480px) 

Voir la spécification , en particulier, exemple VI (emphase ajoutée):

Plusieurs requêtes multimédia peuvent être combinées dans une liste de requêtes multimédia. Une liste de requêtes multimédias séparées par des virgules. Si une ou plusieurs des requêtes de média dans la liste séparée par des virgules sont vraies, la liste entière est vraie et sinon fausse. Dans la syntaxe des requêtes média, la virgule exprime un OU logique , tandis que le mot clé ‘et’ exprime un ET logique.

Je doute que le deuxième soit only nécessaire, donc vous pouvez probablement faire:

 @media only print, screen and (max-device-width: 480px) 

De https://developer.mozilla.org/en/CSS/Media_queries

Vous pouvez combiner plusieurs requêtes multimédia dans une liste séparée par des virgules; Si l’une des requêtes de média de la liste est vraie, la feuille de style associée est appliquée. C’est l’équivalent d’une opération logique “ou”.

Il vous suffit de supprimer le second @media et d’append des crochets.