mercredi 25 septembre 2019

how is CSS scroll-snap specified, and it isn't working on firefox

I want to make some scroll snapping on each section. According to the docs, the container should have scroll-snap-type enabled,

and the direct child will be snapped to.

with the following code, how come it doesn't work. However, if i place on body {scroll-snap-type: y mandatory} it works..except only on chrome and safari.. firefox nightly seem to have problems.

* {
    margin: 0;
}

div {

    scroll-snap-type: y mandatory;
}

section {
    scroll-snap-align: start;
    height: 100vh;
    border: 1px solid black;
    background-color: green;
}

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
    <div>
        <section></section>
        <section></section>
        <section></section>
    </div>
</body>
</html>



Aucun commentaire:

Enregistrer un commentaire