Requêtes médias: vérifiez min-height et min-width?

Je suis en train de changer de CSS sur ma page basé sur le min-height et min-largeur du navigateur, donc je suis en utilisant ceci:

@media (min-height: 500px), (min-width: 580px) {
    /* CSS stuff */
}

Mais pour une raison quelconque, cela ne fonctionne pas. Je peux vérifier min-height et max-width (ou vice versa) ou pour max-height et max-width dans le même temps, mais la vérification de deux minutes ne semble pas fonctionner.

Je doit le préciser plus: je veux le navigateur de loi, si un min-height ou un min-width devient vrai. À l'aide de l'opérateur ne fonctionnera que si les deux critères sont vraies.

Je fais quelque chose de mal?

source d'informationauteur The.Prophecy

  1. 40

    Utilisation and au lieu d'une virgule, comme ceci:

    @media (min-height: 500px) and (min-width: 580px) {
    /* CSS stuff */
}
  2. 5

    Avez-vous ajouté la balise meta suivante dans :

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    Voici REf : http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/quick-tip-dont-forget-the-viewport-meta-tag/

    Après que l'utilisation de votre Requête de média : 

    @media (min-height: 500px) and (min-width: 580px) {
    /* CSS stuff */
}

    Pour les médias requête de détails, vous pouvez plus d'info de http://stephen.io/mediaqueries/ pour tous les appareils iOS. Si vous avez d'autres requêtes faites le moi savoir. Même vous, vous pouvez obtenir une meilleure idée de partir d'ici http://webdesignerwall.com/tutorials/responsive-design-in-3-steps

  3. 5

    Utiliser les médias requête de l'un dans l'autre:

    @media  screen and  (min-height: 40px)  {
   @media  screen and  (min-width: 50px)  {
    /*enter css here to apply for both condition*/
   }
}