Не работаю медиа-запросы, что делать?

Question

[qJelly]

Всем привет! Не работают медиа-запросы... Все дело в том, что браузер их видит, но не использует(В консоли мои медиа-стили есть). В html-коде все стоит правильно, как и должно по правилам каскадности. В консоли браузер просто вычеркивает медиа. Что уже только не делал - ничего не работает.( - эта штука в head вставлена). Код написан на SCSS.

<div class="wrapper__row">
            <p id="button">Нажми на меня :-)</p>
        </div>

//style#button {
                margin: 0;
                padding: 20px 10px;
                width: 30%;

                text-align: center;
                color: rgb(79, 168, 19);
                background-color: white;
                border-radius: 15px;

                user-select: none;
                cursor: pointer;
            }
//style

//media
@media(max-width: 1000px) {
        .wrapper__row {
            #button {
                width: 50%;
            }
        }
    }
}

@media(max-width: 500px){
        #button{
            width: 100%;
        }
}
//media

Comments

[Антон Литвиненко]

надо задать не 4 а 20 одинаковых вопросов, тогда заработают

[qJelly]

Антон Литвиненко, это шутка?

[Одиночка Айс]

qJelly, у вас кнопка заела видимо, вы 3 раза вопрос опубликовали

[Антон Литвиненко]

qJelly, безусловно. Осталось три
Оформите проблему в песочнице, вместе разберемся

[Ankhena]

Даже не знаю с чего начать...

0. Тег для кнопок это button(в крайнем случае a или на старых сайтах можно встретить <input type="button">)
1. Старайтесь не использовать id для стилизации. Используйте классы, а id оставьте для JS, если нужно. Так вы сможете переиспользовать элементы и не будете повышаете специфичность.
2. В представленном вами коде лишняя скобка
3. И неверная специфичность.
селектор .wrapper__row #button имеет большую специфичность, чем просто #button.
Поэтому, стили из второго media не применяются.
Если открыть инспектор кода и посмотреть на вкладку Computed, то в нужном свойстве будет показано почему браузер выбрал то или иное значение.