Having trouble getting items in a dynamic list to align correctly when using Flexbox and wrapping the children. Only the top row isn’t aligning when I choose “Justify: Space Around” or “Justify: Space Between”. I’ve attached a screenshot of the problem, and my read only link is below. This is specifically on the page titled “Blog” at http://vetpronto1.webflow.io/blog
Under class “Recent Post Item” then changing the flex order to Order-First fixed this for me?
Thanks @Matty, that did the trick!
Separate question, the Recent Post Item has rounded corners (4px), and overflow is set to hidden, but when I hover over the link, the resulting interaction seems to remove the rounded corners on the top right and left. Any idea why?
Under “Recent Post Item” class set the z-index to 2000
Happy new year
Hey @Matty! Another question related to this. For some reason the second row isn’t aligning like the first, since there are only 5 items in the collection and not 6. I’ve included a screenshot and link below. Any idea why this is happening? It’s on the page titled “Blog”.
You could try the following;
“Recent post list” then center the element.
Then go to “Recent Post Item” Then give it a left margin to separate the blocks
I’m still getting my head around Flexbox so someone else might have a better solution