Почему я не могу переопределить переполнение тела с помощью медиазапроса?

Question

Я могу совершить очевидную ошибку, но каким-то образом я застрял в следующем:

только для больших экранов, я не хочу вертикальную полосу прокрутки, поэтому у меня есть этот простой CSS:

 @media (min-width : 2000px) {
            // hacky
            body {
                overflow-y:hidden !important;
                }
           .mt-5{
                    margin-top: 80px !important;
                }
                .mb-5{
                     margin-bottom: 80px !important;
                    }
...more style definitions

но почему-то это не работает

Я использую инструмент панели переключателей Chrome для переключения между различными разрешениями. Все другие определения CSS для> 2000px есть, только тело, кажется, не установлено ??

Answer 1

Вы установили 100% высоты для html и body, например:

html, body {
  height: 100%;
}

А также для возможных других дочерних элементов внутри body, которые охватывают всю высоту body?

В противном случае один из них получит полосу прокрутки (не обязательно тело, но будет очень похоже)

Answer 2

@media (min-width : 2000px) {

            body {
                overflow-y:hidden !important;
                }
           .mt-5{
                    margin-top: 80px !important;
                }
                .mb-5{
                    margin-bottom: 80px !important;
                }
}