web-dev-qa-db-fra.com

requête de média pour min-height

Je souhaite rédiger une requête multimédia en fonction de la résolution de l'écran. La hauteur de résolution de mon écran est 768. J'ai rédigé une requête multimédia pour ceci, comme suit:

@media(min-height:768px) and (max-height:850px) {
   .video-contain{
     margin-top:110px;  
    }
}

Ma requête multimédia ci-dessus ne fonctionne pas.margin-top n'est pas défini auparavant. J'ai rédigé une requête multimédia basée sur la résolution de l'écran mais pas sur la hauteur du navigateur.

htmlcssmedia-queries
3
user3386779

Utilisation:

@media screen and ( min-width: 850px ) and ( max-height: 768px )
{
   .video-contain{
     margin-top:110px;  
    }
}

NOTE : Utilisez toujours les requêtes de média de largeur maximale avec un maximum d'effet.

3
Aditya Male

Il semble que le problème est que votre fenêtre d'affichage ne correspond pas à la résolution complète de votre écran.

Si vous réglez la hauteur minimale sur une valeur inférieure, telle que 720px, cela devrait fonctionner.

 @media(min-height:720px) and (max-height:850px)
{
   .video-contain{
     margin-top:110px;
    }

 }
1
Judd Franklin

S'il vous plaît essayez ceci:

@media only screen and (min-width: 768px) and (max-width: 850px) {
}
0
Kashish Agarwal

Vous pouvez définir comme ceci.

@media screen and (max-width: 1600px) and (max-height: 900px){
    //code here
}

@media screen and (max-width: 1600px) and (max-height: 1200px){
        //code here
}

Ou évitez de mentionner la largeur

@media screen and (max-height: 1200px){
            //code here
}
0
CodeMonkey

@ Écran uniquement multimédia et (largeur maximale: 375 pixels) et (hauteur maximale: 667 pixels) {}

0
Rohaan Gulzarvi
//simple max-width query
@media screen and ( min-height: 600px ){
    background: blue;
    ....
}

Cela pourrait vous aider.

0
RRajani