[Bug] Weird jumps on grid container with gaps
See original GitHub issueHi,
I’ve updated to the latest version (1.6.x), and I’ve noticed that there are some jumps of the container when the scroller stops.
I’m able to reproduce it on the demo.
All you need to do is to add css to the #messages
#messages {
border-top: 2px solid rgb(230, 236, 240);
display: grid; // <----
grid-gap: 2em; // <----
}
It is not reproduces on v1.5.x
.
Issue Analytics
- State:
- Created 3 years ago
- Comments:6 (6 by maintainers)
Top Results From Across the Web
CSS Grid Gotchas And Stumbling Blocks - Smashing Magazine
Here we are controlling the layout across the row. We are allowing the flex items to wrap, so they create new rows, but...
Read more >Preventing a Grid Blowout | CSS-Tricks
In our simple demo, the <main> element automatically places itself in that first column as it is the first child of the grid....
Read more >layout() leaves large gaps on specific layouts (columns ...
Hi, I have created a fluid layout where I add a column every 200px. At a packery container width of 800px I'd have...
Read more >Auto-placement in grid layout - CSS: Cascading Style Sheets
You can see how this then leaves gaps in the grid, as for the auto-placed items if grid comes across an item that...
Read more >Why does CSS Grid layout add extra gaps between cells?
The grid items (red lines) neatly wrap their content (the images). This happens only because the container is set to align-items: center ....
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Fixed in
virtual-scroller@1.6.4
You are correct, looks like there is a difference between changing the styles in dev-tools & starting the app with the styles.
Thank you 🙏🏼