Imagine a scenario where there is a #horizontal_scroll element with a height of 150vh. Within this element, there is a child element that is twice as wide as the parent element. Currently, the horizontal scroll of the #horizontal_scroll element is displayed at the end of the element when you scroll the page to the bottom. But is it possible to have this scroll display at the end of the screen (100vh) instead?
https://i.sstatic.net/5E2013HO.jpg
#horizontal_scroll {
background: grey;
width: 50vw;
height: 150vh;
overflow: auto;
}
#horizontal_scroll div {
width: 100vw;
}
<div id="horizontal_scroll">
<div></div>
</div>