Два запроса в формате CSS Переопределяют друг друга

Question

У меня есть 2 медиа-запроса, как показано ниже!

@media screen and (max-width: 800px){ 
    .rightlist{ 
    margin-top: 0px !important; 
    } 

} 


@media (max-width: 1000px) and (min-width: 801px){ 
    .rightlist{ 
    margin-top: -10px !important; 
} 

} 

Когда оба запроса на мультимедиа вместе, вышеуказанный запрос переопределяет нижеследующий. Есть ли кто-нибудь, кто знает об этом? Спасибо за помощь!

Answer 1

Просто используйте это, это CSS будет применяться для экрана до 1000px, но как только вы ударите 800px ваш предыдущий запрос СМИ будут применяться

@media (max-width: 1000px){ 
    .rightlist{ 
    margin-top: -10px !important; 
    } 
}