Skip to content

Instantly share code, notes, and snippets.

@miya0001

miya0001/example.css

Last active Jan 30, 2017
Embed
What would you like to do?
Masonry layout
.masonry-gallery
{
column-count: 5;
-moz-column-count: 5;
column-gap: 8px;
-moz-column-gap: 8px;
margin: 1em 0;
padding: 0;
}
.masonry-gallery .masonry-gallery-item
{
display: inline-block;
margin: 0 0 8px 0;
padding: 0;
width: 100%;
max-width: 100%;
}
@media screen and ( max-width: 768px )
{
.masonry-gallery
{
column-count: 3;
-moz-column-count: 3;
}
}
<div class="masonry-gallery">
<figure class="masonry-gallery-item">
<a href="...">
<img width="165" height="210" ...>
</a>
</figure>
<figure class="masonry-gallery-item">
<a href="...">
<img width="165" height="210" ...>
</a>
</figure>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment