Equal height columns

Hi,

By default, the Columns block displays columns with equal heights. Could you please clarify which columns you are referring to? If possible, please share the URL of your website where I can see the columns in question.

Thanks,
Yann

Example URL:

https://fat.free.nf/2023/09/20/columns-example/

I am trying to do a 6 column on desktop, and a 2 column stack on mobile. But the height is not equal on desktop. Any suggestions please?

Thanks.

In your case you’re using multiple Columns blocks. You can add the tw-height-100 CSS class to your 3 outer Columns blocks to make them equal height. See our guide for adding CSS classes.

Hope that helps,
Yann

Thanks very much, it works!

It’ll be good if there’s an option to specific the number of visible columns for tablet and mobile. This way I won’t have to use nested columns to manage displaying differently on mobile.

Also, it’ll be nice to have a lightbox option for gallery block. And it’ll be one less plugin to install.

Thanks again. You’re awesome!

Thanks for your kind words.

Just to let you know, WordPress now includes a “lightbox” feature. It currently works on a per-image basis (select the image block and toggle the “Expand on click” option on). They are also working to support the gallery block for the next release.

Have a nice day, Yann