I've created a horizontal scroll, but I'm trying to control how the user scrolls while they swipe on their phone screens. In that when a user swipes with a lot of force they are still taken to section B and not directly to section D. So if a person wants to move to section D they would have to swipe three times on their screen and not just one powerful swipe. I've tried using scroll-snap-stop: always; but it doesn't seem to help
<!DOCTYPE html>
<html>
<head>
<style>
body
{
margin:0;
padding:0;
width:100%;
}
#we
{
scroll-snap-type: x mandatory;
flex-basis: 50%;
scroll-snap-stop: always;
display:flex;
overflow:scroll;
width:100%;
position:absolute;
}
#we section
{
position:relative;
scroll-snap-align: start;
margin-top:100px;
min-width:100%;
height:auto;
display:block;
}
</style>
</head>
<body>
<div id="we">
<section>A
</section>
<section>B<br>
</section>
<section > C <br>
</section>
<section > D <br>
</section>
</div>
</body>
</html>
