Hey there! I've been trying to implement scroll-snapping on my project but unfortunately, I couldn't get it to work. I tested it out on both Chrome and Firefox, but no luck so far. Here's the code snippet I've been working with, would appreciate any help or suggestions.
* {
margin: 0;
padding: 0;
}
body {
scroll-snap-type: y mandatory;
overflow-y: scroll;
scroll-snap-points-y: repeat(100vh);
}
header {
height: 100vh;
width: 100%;
background: #ff0000;
scroll-snap-align: start;
}
div {
height: 100vh;
width: 100%;
background: blue;
scroll-snap-align: start;
}
section {
height: 100vh;
width: 100%;
background: yellow;
scroll-snap-align: start;
}<body>
<header>
<h1>
Header
</h1>
</header>
<div>
<h1>
Div
</h1>
</div>
<section>
<h1>
Section
</h1>
</section>
</body>