Archived topic
Columns layout gives different size columns in Block - Content Template
3 replies · Started by _blank on May 14, 2021
Hi
I'm unable to create the columns same size in a 2-column layout for a post archives page when I use the Block element to create a Content Template. I'd want to have it so that even if the content amount differs (longer title, more text etc), the columns are always the same size horizontally - and the buttons are horizontally aligned (in case I use buttons).
I have a GP Block Element and if I try to use any of the existing Content Templates, or create my own, the colums end up not being the same size if one post has longer title that adds an extra row.
It should be this what I'm after:
Grid items with different content heights & aligned bottom block
Or lik here. I've seen the same CSS code referred to in multiple threads as the solution, but I just cannot get it to work after hours of trying.
The custom class is added to a container block (well I've tried all of the places pretty much). The above CSS is added in theme's "Additional CSS". I can see them added when I view the source code, but nothing changes - the columns stay of different height. I'm novice enough with CSS that I can't figure out what I'm doing wrong.
Hi Dewd,
Try add this CSS:
.my-custom-class, .my-custom-class .gb-inside-container > *:last-child {
height: 100%;
}
And change this:
.my-custom-class .gb-inside-container > *:last-child {
margin-top: auto;
}
to this:
.my-custom-class .gb-inside-container > *:last-child *:last-child {
margin-top: auto;
}
Those changes seem to have done the trick for the content templates I was trying to get working.
In two other layout templates ("Layout with offset content" and "Layout with centered content") the columns instead became too long and overlapped the columns below them, but I wasn't planning on using them so no reason to try to troubleshoot that.
CSS is such a mystery, never would have figured out those changes myself.
This is solved. Thanks for your help Ying!
Glad that it works for you now, and you are very welcome :)