@Media Screen Kullanımı Konusunda

Merhaba Arkadaşlar,

Web sitem için ekranlara göre @media kuralları yazıyorum. Fakat burada benim için önemli olan nokta ekranın width(genişliği) yerine height(yüksekliği). Yazdığım kurallar tarayıcıların developer tools aracının responsive site test kısımlarında veya internette bulunan responsive site test araçlarında sağlıklı çalışıyor. Fakat bilgisayardaki tarayıcılarda her iki kuralıda sağladığı için kendisi için doğru olanı çağırıyor. Rica etsem yardımcı olabilir misiniz? Kullandığım kurallar aşağıdaki gibidir;

@media (min-width:1024px) and (min-height:768px){...........}
@media (min-width:1280px) and (min-height:720px){...........}
@media (min-width:1280px) and (min-height:800px){...........}
@media (min-width:1440px) and (min-height:960px){...........}

Örneğin; Genişliği 1440px Yüksekliğide 960px olan bir tarayıcı yukarıdaki durumda 1280x800 olan kısımdaki kodları çalıştırıyor. Bunun önüne nasıl geçebilirim?
Not: 1440x960'ı 1280x800'ün üstüne aldım yani sıralamaları değiştirdim fakat değişen bir şey olmadı.

Bunu dener misiniz?

@media (max-width:1024px){...........}

Benim için önemli olan yükseklik ama sizin yazdığınız kural ekran genişliği 1024'e kadar olanlar için anlamına geliyor. Ben her iki kuralıda sağladığında çalışmasını istiyorum.

@media (max-width:1024px)(max-height:870px){...........}

Bu durumda yükseliği 970px olan ekranı da ele aldığımda @media (max-width:1280px) and (max-height:970px) diye bir şey yazmam gerekecek. Bu seferde max-width:1280 olduğu için 1024'üde kapsıyor. Haliyle tarayıcının kafa karışıyor, neyi çağıracağını bilemiyor.