nikitaeverywhere / react-xmasonry

Simple, minimalistic and featured native masonry layout for React JS.
https://zitros.github.io/react-xmasonry
MIT License
91 stars 12 forks source link

Issue with space between blocks #28

Open intelligence opened 1 year ago

intelligence commented 1 year ago

Hey!

Thanks for a great package, it's the only one I've found that can handle variable widths and heights, it's very useful for a project I'm currently working on :)

I've stumbled upon a small issue that I think relates to calculations of positions of blocks. In some instances there will be a minimal gap between blocks. See the attached video where I have purposely made all blocks green to highlight the issue. I wonder if this issue could easily be fixed by rounding off upwards for width/horizontal position to make sure that there's no gap between the blocks.

https://user-images.githubusercontent.com/756582/233088006-5841b5b9-e93f-4408-b4c5-41dd81d10c79.mov

nikitaeverywhere commented 1 year ago

Hello! Thanks for the feedback!

Quite interesting. I think rounding alone won't solve this problem, but will introduce an overlap problem then. Try playing with this line, might be round instead of floor will be a better fit.