IE11 masonry layout is broken (+ solution)

cedricdelpoux / react-responsive-masonry

React responsive masonry component built with css flexbox

https://cedricdelpoux.github.io/react-responsive-masonry/

MIT License

362 stars 37 forks source link

IE11 masonry layout is broken (+ solution) #47

Closed rradoychev closed 2 years ago

rradoychev commented 3 years ago

Case: The elements inside the masonry create big gaps between each other vertically making the page look broken. Reason: flex value of the display property

An easy fix for this is to target the inner DIV inside the masonry's main flexbox DIV via css and override the display: flex; property with display: block;. In this way, we don't tweak the library's files.

Probably this library isn't intended to support IE11 fully, but if anyone needs it to - that's the way to go.

cedricdelpoux commented 2 years ago

Hi, this library was not intended to support IE11 but PR are welcome if you want to help 🤝