Making columns equal height

[Aph100]

Hi
On modbury.church you will see two columns - Team News and Forthcoming Services. Is there a way please to force the column to equal height?

Also on the Forthcoming services, I am using MEC - Grid view - simple. Is there a way to reduce the amount of space between the events?

Thanks for your help

[ruenel]

Hello There,

Thanks for writing in!

To have an equal column heights, please check out this snippet:

Use Flex Layout | Themeco Docs

And to minimize the amount of space between your events, please add the following CSS code in the X > Launch > Theme Options > Global CSS (http://prntscr.com/evui3r)

.mec-event-grid-simple .mec-event-article {
    margin-bottom: 0;
}

.mec-event-grid-simple .row {
    margin-bottom: 10px;
}

Please let us know how it goes.

[Aph100]

Hi thanks for your speedy response. I have added the code from the snippet, changing the section names and saved the code. However the issue still remains. Nit sure what I have done wrong.
Thanks

[christopher]

Hi there,

I suggest that you go to the section which you have those columns and click on the Customize tab of that section and add the sameheight class.

Then add the CSS code below to X > Launch > Options > CSS:

.sameheight .x-container {
    display: flex;
}

The solution above is different than the one suggested before. Thank you.

[Aph100]

Thanks that is great works well

Thanks for your excellent help

[thai]

You’re welcome.