[Resolved] Equal height grid containers

[Philip]

Hi Guys,

I’m struggling a bit with equal height grid containers and thought you could help.

I’ve followed the instructions below without success:

https://docs.generateblocks.com/article/equal-height-grid-containers/

I suspect it’s something simple — I just can’t see it.

See private info.

Thanks.

Phil

—–

Host: WP Engine
Server: Nginx
PHP: 8.0.28
WordPress: 6.1.1
GeneratePress theme: 3.3.0 with starter child theme
GP Premium: 2.3.0
GenerateBlocks: 1.7.3
GenerateBlocks Pro: 1.5.2

[Ying]

Hi there,

1. Set the Grid containers to display: flex, flex-direction: column.

2. Set the purple backgrounded container to flex-grow:1.

[Philip]

Thanks. That works.

For future reference, is there something unusual about my layout that requires these additional settings?

Phil

[Ying]

As you have additional containers inside the Grid containers.

The documentation is more for a simple layout like this:

-Grid
 - container
   - element 1
   - element 2
   - element 3 
 - container
   - element 1
   - element 2
   - element 3 

[Philip]

Understood. Thanks again for your help.

[Ying]

No problem!

I probably should include a similar layout like yours as an example in the documentation as well 🙂

[Author]

Posts