andre/30-seconds-of-code
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Revamp snippet descriptions

Browse Source
This commit is contained in:
Chalarangelo
2020-12-30 15:37:37 +02:00
parent 27bae0477f
commit 16a4e06e85
59 changed files with 341 additions and 302 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
snippets/horizontal-scroll-snap.md
View File

@ -3,7 +3,7 @@ title: Horizontal scroll snap
tags: interactivity,intermediate
---
Creates a scrollable container that will snap on elements when scrolling.
Creates a horizontally scrollable container that will snap on elements when scrolling.
- Use `display: grid` and `grid-auto-flow: column` to create a horizontal layout.
- Use `scroll-snap-type: x mandatory` and `overscroll-behavior-x: contain` to create a snap effect on horizontal scroll.
@ -43,6 +43,7 @@ Creates a scrollable container that will snap on elements when scrolling.
.horizontal-snap img {
width: 180px;
max-width: none;
object-fit: contain;
border-radius: 1rem;
}