Skip to content

Instantly share code, notes, and snippets.

@adamculpepper

adamculpepper/masonry-layout.css

Last active June 3, 2019 16:45
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save adamculpepper/b1f602d8577c2fbca8e199846f9c2e96 to your computer and use it in GitHub Desktop.
Save adamculpepper/b1f602d8577c2fbca8e199846f9c2e96 to your computer and use it in GitHub Desktop.
Download ZIP
Masonry Layout - CSS only
Raw
masonry-layout.css
/* Masonry */
.masonry {column-count:1; column-gap:1.5em; margin:1.5em auto;}
.masonry .item {display:inline-block; margin:0 0 1em; width:100%;}
.masonry .item iframe {max-width:100%;}
/* Large (lg) and up */
@media (min-width:992px) {
.masonry {column-count:2;}
}
/* Extra Large (xl) and up */
@media (min-width:1200px) {
.masonry {column-count:3;}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment