[Resolved] Grid content sizes

[Dave]

Hey guys, I have the grid-33 set up on my home page and I then have pages inserted as widgets within each 1/3 grid section. I want them to all be the same height as opposed to having each sized based on the content like they are now. How do I do that and still keep it responsive?

Here’s the site: http://crescenttest.com/

Thanks!

[Leo]

Hi Dave,

Unfortunately it’s not possible to have equal height columns using the built in grid system.

Flexbox is required in this case.

Can you give this a shot? https://codepen.io/imohkay/pen/gpard

Let me know 🙂

[Dave]

Hey Leo, I tried that and it worked to make them all the same height but now they aren’t responsive. It’s currently active on the site.

[Tom]

Try adding this:

@media (max-width: 768px) {
    .eqWrap {
        display: block;
    }
}

[Dave]

Tried that an it didn’t work either. I think I’m just gonna go back to grid-50 and grid-50 and see if that works for what we need.

Thanks for the help!

[Tom]

No problem – let me know if you want to keep working at flexbox 🙂

[Author]

Posts