Repository navigation
Basic instructions not working...? #3
Description
Activity
If you're loading a page with images I suggest using something like https://imagesloaded.desandro.com and calling
FlexMasonry.refreshAll();once all of the images have loaded.Is that because you're concerned that the images should be loaded first? If that's the case then I should just be able to do:
window.onload = function () { FlexMasonry.refreshAll(); };
But that still doesn't fix the problem. I've even tried adding a timer delay before refreshing, and it still doesn't do anything different. I think you should set up a working demo that's based on the basic instructions, so users can play around with it.
@impressivewebs what about containing the images to the column width ?
img { max-width: 100%; height: auto; }I did it on that pen and got some mixed results. When resizing the window it worked fine. Sometimes on load I'd get some gaps between the images. I think this is related to the PR which is open (#4) so adding
.grid { align-content: flex-start; }would get rid of those gaps I believe.
Hi, your tool seems nice in the demo on the home page, but I can't figure out how a basic demo is supposed to be set up from scratch.
For example:
https://codepen.io/impressivewebs/pen/rNNqgEM?editors=0010
I believe I've done whatever the instructions say, but I'm not seeing anything resembling a responsive grid that fits in the viewport. Am I supposed to do something to prevent the horizontal scroll bars? When I add a max-width to the container, it doesn't seem to help.
It might be good to include a demo with the unsplash images that looks practical and usable...? Just my two cents, but certainly my limited understanding of this library might be the main culprit here. Thanks.