-
I’m probably missing something obvious, but on this play page I have a 4 column container using flex.
(I know grid is better for this, but I know it is simple layout & flex can do it!)I have set it to flex for tablet, and made the 4 content containers 50%, but it does not play ball ?
TIA, Dave
-
Hi there,
Replace those containers with a 4-columns Grid block instead.
By the way, don’t get confused between the Grid block and CSS Grid; they’re completely different.
-
Sorry I should have been specific.
I am trying to move away from the Grid Block that comes with GB
I am updating some content on a clients site and thought it would be a good idea to do it with Flex.
And yes I know Grid is more flexible, but this is a simple 4 column layout that I want to go 2 x 2 when the breakpoint is tablet.
I’m sure I have done this before, am I making it too hard on myself 🙂
Thanks, Dave -
Hi Dave,
couple of things:
1. the Layout Flex Wrap needs to be set to Wrap.
2. the Column Gap has been to considered in the 50% width, because stupid Flex treats it inside the content.
So setting the width to:calc(50% - 10px)would resolve that. -
Thanks David, all working fine now, thanks!
-
Glad to hear that
- You must be logged in to reply to this topic.