Запросы для СМИ игнорируются браузером

Question

Я пытаюсь вставить простой медиа-запрос, чтобы форма отправки охватывала 90% ширины страницы при просмотре на телефоне (она устанавливается на 50% в любое другое время). Когда я масштабирую видовое окно вниз, он не поднимает медиа-запрос. Вот мой код:

СКС:

@media(max-width:767px){ 
    .submit{ 
    width: 90%; 
    } 
} 

.submit{ 
     width: 50%; 
     margin: auto; 
     margin-top: 300px; 
     margin-bottom: 300px; 

     .submitBackground{ 
     background-color: $orange; 
     opacity: .6; 
     padding: 20px; 
     } 
     .submitEvent{ 
     background-color: white; 
     opacity: .6; 
     button{ 
      margin-top: 15px; 
      margin-bottom: 15px; 
     } 
     } 
    } 
    form{ 
     width: 80%; 
     margin: auto; 
     text-align: center; 
     padding: 20px; 
     .form-control{ 
     margin: 10px; 
     } 
     .radio-inline{ 
     margin: 10px; 
     position: relative; 
     } 
    } 

Answer 1

Ваш медиа-запрос должен быть после, не входящих в СМИ декларации запроса. В противном случае он не сможет переопределить свойство.

.submit { 
    ... 
} 

@media (max-width:767px) { 
    .submit{ 
    width: 90%; 
    } 
}