Почему не применяются медиа запросы?

Question

[Shaurma1]

Значит я задаю стили через медиа запрос, они вроде бы применяются, но нет, в девтулс они перечеркнуты и не работают стили заданные через медиа.
Пробовал !important но из-за него нарушается компиляция Sass

@media ( max-width: 1200px )
    .promo
        &__title
            font-size: 47px
        &__subtitle
            font-size: 30px

Comments

[Ankhena]

Почему перечеркнуто, написано на вкладке Computed (если речь про хром).
Вероятно, у селектора без media выше специфичность.

[Shaurma1]

Ankhena, Ну перечеркнуто в смысле не работает. И в Computed ничего нет про это

[bingumd]

А вы точно смотрите при разрешение до 1200px?
И какие еще font-size есть у .promo__title?

[Сергей delphinpro]

Специфичность селекторов.
Каскад.

Элементарные вещи, без понимания которых делать в CSS нечего.

[Ankhena]

Shaurma1,

Ну перечеркнуто в смысле не работает. И в Computed ничего нет про это

Так не бывает.

Покажите:
1. Скрин вкладки Computed там где про свойство font-size для этого элемента. Либо всю панельку style касающуюся этого элемента.
2. Код в песочнице, иллюстрирующий проблему.

Есть ещё одна мысль, почему у вас media находится на 3 строчке файла style.sass
Медиа всегда идут ниже основного свойства.

И вообще, зачем вы используете препроцессоры, если проблемы с базовыми вещами CSS.

[Ankhena]

Shaurma1,

Точно. У .promo__title еще font-size: 50px, это не через медиа

бывает...

[Froggyweb]

Пробовал !important но из-за него нарушается компиляция Sass
вряд ли он отлично работает, но использовать нужно очень аккуратно.
ну и про селекторы https://developer.mozilla.org/ru/docs/Web/CSS/Spec...