Колесо прокрутки мыши не работает на границе MS после настройки переполнения: авто в html теле - PullRequest
Новая
       15

Колесо прокрутки мыши не работает на границе MS после настройки переполнения: авто в html теле

0 голосов
/ 02 мая 2020

У меня есть следующая таблица стилей css для страницы в моем ASP. NET Core MVC проекте: 

body {
background-repeat: no-repeat;
background: linear-gradient(30deg, rgba(121, 110, 255, 0.95) 0%, rgba(33, 200, 122, 0.95) 100%);
background: -webkit-linear-gradient(30deg, rgba(121, 110, 255, 0.95) 0%, rgba(33, 200, 122, 0.95) 100%);
display: flex;
flex-direction: column;
height: 100%;
width: 100%;
resize: both;
overflow: auto;}

После добавления строки overflow: auto; эффект был , что я больше не мог прокручивать страницу по вертикали, используя колесо мыши на MS Edge. Все остальные браузеры работают нормально.

На этом есть нить была ветка, но не было предоставлено действительного предложения или помощи. Эта тема заблокирована.

Любое предложение или обходной путь?

Ответы [ 2 ]

1 голос
/ 02 мая 2020

В вашем случае overflow: auto; полезен только для фиксации фона, так как вы применяете его ко всему телу. (Sidenote: вы можете захотеть сделать overflow : scroll вместо auto)
Но правильный способ исправить фон - использовать background-attachment: fixed;: 

body {
background-repeat: no-repeat;
background: linear-gradient(30deg, rgba(121, 110, 255, 0.95) 0%, rgba(33, 200, 122, 0.95) 100%);
background: -webkit-linear-gradient(30deg, rgba(121, 110, 255, 0.95) 0%, rgba(33, 200, 122, 0.95) 100%);
display: flex;
flex-direction: column;
height: 100%;
width: 100%;
resize: both;
background-attachment: fixed;
}

Я предполагаю, что ошибка "потому что ваш код создает прокручиваемый элемент внутри страницы, который уже можно прокручивать. Возможно, попробуйте нажать на свою страницу, прежде чем прокручивать, чтобы быть уверенным.

1 голос
/ 02 мая 2020

Я думаю, что в вашем CSS происходит то, что вы добавляете некоторые вещи, которые автоматически решаются браузером. Например: 

body {
background-repeat: no-repeat;
background: linear-gradient(30deg, rgba(121, 110, 255, 0.95) 0%, rgba(33, 200, 122, 0.95) 100%);
background: -webkit-linear-gradient(30deg, rgba(121, 110, 255, 0.95) 0%, rgba(33, 200, 122, 0.95) 100%);
display: flex;
flex-direction: column;
height: 100%;
width: 100%;
resize: both;
}

Я не думаю, что overflow: auto необходим и что это была проблема. На теле не должно быть необходимости добавлять overflow: auto, поскольку тело обычно делает это самостоятельно.

Скажите, пожалуйста, поможет ли это. Спасибо!

...