Skip to content

Instantly share code, notes, and snippets.

@biswajitpaul01

biswajitpaul01/index.html

Created November 24, 2018 13:00
Show Gist options
  • Save biswajitpaul01/f89769eb1336e1bdab71515eeea5f0a8 to your computer and use it in GitHub Desktop.
Save biswajitpaul01/f89769eb1336e1bdab71515eeea5f0a8 to your computer and use it in GitHub Desktop.
Download ZIP
scroll snapping
Raw
index.html
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/12005/gallery2.jpg">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/12005/gallery6.jpg">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/12005/gallery2.jpg">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/12005/gallery6.jpg">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/12005/gallery2.jpg">
<img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/12005/gallery6.jpg">
Raw
style.css
body {
margin: 0;
padding: 40px 0 0 0;
display: flex;
overflow-x: scroll;
scroll-snap-type: x mandatory;
}
img {
width: 31vw;
height: 300px;
margin: 0 3.5vw 0 0;
object-fit: cover;
scroll-snap-align: start;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment