Vertical scroll snap

Lien d’origine: https://codepen.io/argyleink/pen/yLovWjz

HTML:

<center><section class="slideVertical">
<div class="containervert">
<div class="box has-background-white">
<h1 class="has-text-black">slide 1</h1>
</div>
<div class="box has-background-black">
<h1 class="has-text-white">slide 2</h1>
</div>
<div class="box has-background-white">
<h1 class="has-text-black">slide 3</h1>
</div>
<div class="box has-background-black">
<h1 class="has-text-white">slide 4</h1>
</div>
<div class="box has-background-white">
<h1 class="has-text-black">slide 5</h1>
</div>
</div>
</section></center>

CSS:

.slideVertical{
box-sizing: border-box;
height: 500px;
}
.slideVertical .containervert{
width: 100%;
height: 100%;
scroll-snap-type: y mandatory;
overflow-y: scroll;
scrollbar-width: none;
display: block;
}
.slideVertical div {
display: scroll;
align-items: center;
justify-content: center;

flex: none;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
scroll-snap-align: start;
}