Comments (4)
Oh apologies, you are correct! I'll get the readme updated. If you're needing IE9 support, it should be as simple as replacing flexbox with floats to control the layout. Something like this:
.my-masonry-grid {
margin-left: -30px; // gutter size offset
}
.my-masonry-grid:after { // "clearfix" technique
content: '';
display: block;
clear: both;
}
.my-masonry-grid_column {
float: left;
padding-left: 30px; // gutter size
margin-bottom: 30px;
}
from react-masonry-css.
If you have the option to use "autoprefixer" (https://autoprefixer.github.io/) plugin when compiling your css, the IE9 compatible flexbox rules will automatically be added for you. Otherwise just paste the css into the generater at the link above. Hope that works for you!
from react-masonry-css.
Thanks for your quick answer...
I do have "autoprefixer" plugin, but correct me if I am wrong, maybe my comprehension is not good, even with "prefix" flexbox
is not supported for IE9... https://caniuse.com/#feat=flexbox
from react-masonry-css.
Thanks, I'll make some tests :)
from react-masonry-css.
Related Issues (20)
- [Masonry] The property "columnClassName" requires a string - Error shows in Chrome console HOT 2
- Publish react 17 peer dependency fix to npm HOT 5
- very different columns height HOT 1
- ie11 support HOT 2
- Add support for css modules HOT 3
- height of div would take equal to image height mean while image is loading. HOT 4
- 'Masonry' cannot be used as a JSX component HOT 2
- breakpoint for column not working HOT 1
- Is there a way to draw a solid vertical line between columns? HOT 1
- Add a way to emulate `min-width` instead of `max-width` alike media queries for breakpoints checks HOT 4
- Does anybody use with next/image? it doesn't work. HOT 4
- Fixed width according to number of breakpoints
- Long item in first column causes gaps in other columns HOT 5
- Latest version of TypeScript causing errors HOT 1
- Changing column count calculation to depend on container width instead of window width HOT 2
- Add support for logic operator regarding responsive columns
- some elements can occupy more than one column
- Thank you
- Next.js Elements being in components breaks column render
- Balancing of total items height in each column is broken :-(
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-masonry-css.