css

Grid, sticky, snap et smooth

Publié le par benoit
dans la ou les catégorie(s) : code et avec pour étiquette(s) :

En attendant une page dédiée aux « nouveautés » CSS, voici un article et un petit CodePen qui exploite trois propriétés récentes :

  • position:sticky , le fixed moderne.
  • scroll-snap-align: start; & scroll-snap-type: y mandatory; pour avoir un accrochage sur les items.
  • scroll-behavior: smooth; pour une transition sur les liens ancrés.

En bonus : une croix filaire en quelques lignes de SVG.

À tester ici

See the Pen grid + sticky + snap + smooth by Benoît Wimart (@benoitwimart) on CodePen.default