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