layout breaks when at certain breakpoints

[neptunian]

layout breaks when at certain breakpoints

[louisdvs]

Hey,
Thanks for the awesome component!
I'm still getting this issue with the current version have you pushed your fix to npm?
Cheers

[neptunian]

@louisdvs i published a new release

[louisdvs]

@neptunian thanks, my layout was still breaking at certain widths (updated to 5.6.2), I changed the value from 1 to 2 and it's not breaking anymore.

// subtract 1 pixel because the browser may round up a pixel
const containerWidth = this.state.containerWidth - 2;

Cheers

[marko911]

This is still an issue, in IE 11. I've updated to 5.6.2, I also tried changing containerWidth to 2, 3, even 5 but still doesn't make a difference. The columns still break at certain breakpoints and I end up having one image in a row instead of 3 , and then the other 2 on the next row. @neptunian

[neptunian]

@marko911 are you not able to update to the very latest version?

[marko911]

@neptunian I did update successfully but the problem persists in IE 11. Its fixed in chrome yes but not IE.

[neptunian]

@marko911 okay i'll look into it, thank you

[marko911]

any updates on this @neptunian ?

[neptunian]

@marko911 i tested in IE11 at various breakpoints and could not get the layout to "break". Did you mess with the CSS at all of the images in an external stylesheet?

[marko911]

@neptunian no I didn't change any css , but here check out how it breaks where I use it maybe its something else I didn't think of (scroll to collection) : LINK

[neptunian]

did you try updating to version 6?

[marko911]

Hi, Yes, but still breaking. I've taken my images and properties and ported them into your demo and they don't break in the demo so I am trying to investigate now why it is breaking in my app. Thanks for follow up. @neptunian

[neptunian]

let me know if you can't find a solution. right now the image sizes are calculated down to fractions of a pixel. it makes it so everything looks very even, but i think i can round it down a bit to leave some "safe space" when things are a bit off for whatever reason.

[marko911]

@neptunian You can close this. I've resolved the issue using the new version and a custom image component. There are no issues with your code , thanks for support :)

[neptunian]

okay cool, well i published a new release anyway getting rid of some decimals that might have helped :)