Реализовать отзывчивое наложение переполнения - PullRequest
0 голосов
/ 19 декабря 2018

Как сделать блок с полосой прокрутки, появляющейся над ним, без изменения его содержимого.И это должно быть отзывчивым.То же самое, что и overflow: overlay в Chrome.

Пример:

screenvideo of result

Шаблон: http://jsfiddle.net/3gf520ht/

* { box-sizing: border-box; }
html, body { height: 100%; margin: 0; overflow: hidden; }
main { width: 80%; height: 80%; margin: 10vh auto; border: 1px solid; }
article { text-align: justify; }

main {
  padding: 0 2em;
  overflow: overlay;
}

article {
}
<main>
  <article>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pellentesque convallis vestibulum. Proin sed porta urna, eu fermentum velit. Nulla quis accumsan augue, mollis eleifend felis. Aenean venenatis faucibus erat, non ornare ex efficitur ut. Ut ligula urna, auctor non velit quis, ultricies aliquet diam. Nulla quis scelerisque nisl, rutrum consectetur diam. Etiam bibendum tellus orci, iaculis varius risus congue vitae. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum sed velit sit amet quam ultrices facilisis. Mauris malesuada vehicula purus, in blandit lectus pellentesque in. Duis luctus, risus et molestie venenatis, libero ligula volutpat augue, vitae bibendum arcu leo vel ligula. Etiam aliquet semper velit ut fringilla.</article>
</main>

PS: Тот же вопрос на русском языке.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...