Почему из-за grid не работает событие на кнопке?

Question

[helpmeplease196]

При нажатии на кнопку "добавить" должно срабатывать событие alert. Пока экран не уменьшается до 900px все работает корректно.
При экране меньше 900px работает только если убрать display: grid; (10 строка css) или убрать 162 строку css для измененения разметки при уменьшении экрана

Почему это происходит?

Answer 1

[Ankhena]

Потому что кто-то написал в вашем коде это:

@media (max-width: 900px)
.wrap-catalog-cake, .wrap-catalog-pie, .wrap-catalog-mini-cake, .wrap-catalog-gift {
    grid-area: 1/1/2/4;
}

И оно перекрывает всё что под ним.

Comments

[helpmeplease196]

Да, понимаю, что проблема в этой или 10 строке. Но почему оно перекрывает нажатие кнопки это же разные файлы? ( css и js). К тому же стили послле этой строки союлдюдаются. именна классов не поменялись, то есть js должен их находить

[Ankhena]

helpmeplease196, да просто не происходит клика по кнопке. Потому что поверх лежит другой блок.
Я без понятия зачем он у вас там.

Почитайте про pointer-events - это свойство делает блок прозрачным для клика.

[helpmeplease196]

Ankhena, спасибо