Container elements of equal height

This thread is resolved. Here is a description of the problem and solution.

Problem:
The customer asked how to make container blocks inside the view's grid loop, have equal height.

Solution:
Shared some custom CSS code for this.

Relevant Documentation:
n/a

This support ticket is created 2 years, 9 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun	Mon	Tue	Wed	Thu	Fri	Sat
-	9:00 – 13:00	9:00 – 13:00	9:00 – 13:00	9:00 – 13:00	9:00 – 13:00	-
-	14:00 – 18:00	14:00 – 18:00	14:00 – 18:00	14:00 – 18:00	14:00 – 18:00	-

Supporter timezone: Asia/Karachi (GMT+05:00)

Tagged: Toolset Blocks, Views, Views plugin

This topic contains 2 replies, has 2 voices.

Last updated by jillT 2 years, 9 months ago.

Assisted by: Waqar.

Author

Posts

February 15, 2022 at 4:34 pm #2293155

jillT

I have a search view with the results in a container > 2 column grid. I want each container to be the same height.

I originally had a simple grid, and following this worked: https://toolset.com/forums/topic/grid-elements-equal-height/

However, when I added a container to hold them in, I have been unable to find the classes I need to change to make it work again

Page in question: hidden link

February 16, 2022 at 7:40 am #2293783

Waqar

Hi,

Thank you for contacting us and I'd be happy to assist.

For this particular structure, you can replace custom CSS code from the other ticket with:


.js-wpv-loop-wrapper > .tb-grid > .tb-grid-column > .wpv-block-loop-item,
.js-wpv-loop-wrapper > .tb-grid > .tb-grid-column > .wpv-block-loop-item > .tb-container {
	height: 100%;
}

I hope this helps and please let me know if you need any further assistance around this.

regards,
Waqar

February 16, 2022 at 8:41 am #2293833

jillT

My issue is resolved now. Thank you!