Acho que precisamos escrever uma consulta de mídia mais específica. Certifique-se de que se você escrever uma consulta de mídia, isso não afetará outra visualização (Mob, Tab, Desk), caso contrário, poderá haver problemas. Gostaria de sugerir que você escreva uma consulta de mídia básica para o respectivo dispositivo, que abrange tanto a consulta quanto a consulta de mídia de orientação, que você pode codificar mais sobre orientação de exibição por boas práticas. Não precisamos escrever as duas consultas de orientação à mídia ao mesmo tempo. Você pode consultar o meu exemplo abaixo. Sinto muito se minha escrita em inglês não é muito boa. Ex:
Para dispositivos móveis
@media screen and (max-width:767px) {
..This is basic media query for respective device.In to this media query CSS code cover the both view landscape and portrait view.
}
@media screen and (min-width:320px) and (max-width:767px) and (orientation:landscape) {
..This orientation media query. In to this orientation media query you can specify more about CSS code for landscape view.
}
Para Tablet
@media screen and (max-width:1024px){
..This is basic media query for respective device.In to this media query CSS code cover the both view landscape and portrait view.
}
@media screen and (min-width:768px) and (max-width:1024px) and (orientation:landscape){
..This orientation media query. In to this orientation media query you can specify more about CSS code for landscape view.
}
Área de Trabalho
faça conforme sua exigência de projeto desfrutar ... (:
Obrigado, Jitu