Как сделать так что бы Media.css неперекрывал main.css, стоя на 2 позиции?

Question

[minazavr]

Всем привет, столкнулся с такой проблемой , что media.css перекрывает main.css , при этом стоя на 2 позиции в html. По идее все нормально , большинство элементов принимают значение по дефолту от main.css без изменения ширины , но некоторые элементы априори принимают значения из media.css перечеркивая свойства из main.css , хотя ни каких манипуляций с экраном не происходило. В чем может быть проблема и как ее решить?( тегов !important нет )

Answer 1

[Сергей Горячев]

style.css

.block { } // правильно
.block .elem { } // правильно

media.css

@media screen and (max-width: 1000px) {
    .elem { } // не правильно
    .block .elem { } // правильно
}

Answer 2

[sochi-russia]

Проверьте в media.css теги с окончаниями !important. Попробуйте удалить у них !important

Comments

[minazavr]

в том то и дело, их нет)

Answer 3

[Василий Петров]

Была похожая проблема.

Не помню всех деталей, что-то не так там было с порядком стилей для размеров экрана. Сначала вроде маленькие размеры были (узнал позже — это mobile first). Поменял на desktop first и все решилось. Или у меня в разнобой стояли размеры экранов: 320, 1000, 540 — как-то так. Точно не помню, но помню одно — проблема была с порядком расположения размеров экрана.