1.0.9 • Published 2 years ago
mm-masonry v1.0.9
MM Masonry Photo Gallery
Demo
Config the column width and gap
Using css selector:
.mm-masonry {
--_col-width: 240;
--_gap: 8;
}
Or directly in the html tag:
<div class="mm-masonry" style="--_gap: 20">...</div>
Disable option
You can control the disable option by using the following css selector:
.mm-masonry {
--_display: block; /* unset | flex | ...*/
--_gap: 0; /* Or a value */
}
Using some JavaScript
CSS Grid + image load event
Set image dimensions when onload
event in Javascript.
Demo: CSS Grid + image load event
CSS columns
The simplest way: with CSS Columns.