@media (min-width:) и (max-width:) query not working Правильно

Question

Я использую @media запрос для преобразования моей страницы html на отзывчивую страницу, но я застрял, чтобы преобразовать мою страницу в отзывчивую страницу.

я использую

@media(min-width:480px) and (max-width:959px) 
{ 
    body 
    { 
     background-color:red; 
    } 
} 

в моем CSS кодекса

но цвет фона меняется, когда мой браузер ширина 942px. и любой CSS-код, который я пишу для @media(min-width:480px) and (max-width:959px). Стиль CSS работает отлично только для (max-width :).

с этими ошибками/проблемами я не могу преобразовать мою страницу html в отзывчивую страницу.

Answer 1

Используйте всегда этот код для создания отзывчивого

@media screen and (max-width: 1024px){ 

    /*Your style put here*/ 

} 

@media screen and (max-width: 768px){ 

    /*Your style put here*/ 

} 

@media screen and (max-width: 640px){ 

    /*Your style put here*/ 

} 

@media screen and (max-width: 480px){ 

    /*Your style put here*/ 

} 

@media screen and (max-width: 360px){ 

    /*Your style put here*/ 

} 

@media screen and (max-width: 320px){ 

    /*Your style put here*/ 

}