Почему не применяется стиль в Media?

Question

[Alex Sokol]

1. Установлен стиль для страницы:

.site-cover {
	background: url('../images/pattern.jpg') repeat;
	margin-top: 170px;
	margin-bottom: 60px;
	box-shadow: 0px 0px 5px #999;
}

2. Нужно отменить для экранов 960px и меньше media screen and (max-width: 960px) некоторые стили:

.site-cover {
	background: none;
	box-shadow: none;
}

Почему-то не срабатывает. Если ставлю display: none; - то срабатывает, однако этот стиль не нужен.

Answer 1

[Андрей Мохов]

предполагаю, что второй код с media указан в разметке раньше первого, таким образом получается, что первый переопределяет второй

Comments

[Alex Sokol]

Так и есть. Меди стоит выше первого кода. В этом проблема?

[Alex Sokol]

Да. Вы правы. Поменял местами, теперь все работает. Может подскажите где можно узнать больше информации по этому вопросу? Спасибо

[Николай Шабалин]

Sokol_ua: htmlbook.ru/samcss/kaskadirovanie

Answer 2

[Боб Хоуп]

Возможно, Андрей прав, или есть какая-то другая ошибка в разметке, нужно смотреть, потому что вот этот простой примерчик с вашими стилями - работает:

codepen.io/anon/pen/KwxdMy

Comments

[Alex Sokol]

Да, Андрей прав. Уже поправил. Все работает. Спасибо.