Estou tentando criar um layout responsivo. Alguns elementos ele está aplicando o css conforme citado no media queries, alguns outros está pegando css do web. Como posso concertar pra ele pegar o css correspondente do que eu quero? Porque isso ocorre?
Segue exemplo:
.scss:
@media (min-device-width: 320px)
and (max-device-width: 564px){
.button-collapse{
background-color: red;
border: none;
color: red;
outline: none;
}
}
.button-collapse{
background-color: transparent;
border: none;
color: white;
outline: none;
}
Neste caso, usando um dispositivo 320px width ele está pegando as propriedades fora do media querie, porque ocorre isso? Segue imagem com mais detalhes.