Почему у меня есть две вертикальные полосы прокрутки после переключения с ReactJS на NextJS?

#html #css #reactjs #scroll #next.js

Вопрос:

Я создал небольшой проект на простом языке ReactJS и поместил эти две строки в свой index.css файл:

 overflow-y: scroll;
overflow-x: hidden;
 

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

Теперь я преобразовал тот же проект в приложение NextJS, и в моем есть те же две строки globals.css . Того index.css здесь не существует. Но теперь результат-две вертикальные полосы прокрутки:

введите описание изображения здесь

Я провел глобальный поиск в своем проекте по этим двум строкам, но нашел их только в своем globals.css файле.

Почему это так? И как я могу вернуть себе желаемое поведение?

Ответ №1:

Я уже нашел решение.

После осмотра полос прокрутки в chrome я обнаружил, что они были сгенерированы на уровне html. Поэтому я вставил свои две строчки

 overflow-y: scroll;
overflow-x: hidden;
 

в html-блок вместо основного блока, и это сработало.