I need assistance with creating three columns of equal height in WordPress using the WPBakery Builder and Minti Theme "Unicorn". Unfortunately, I can't provide the full code here. Can someone help me resolve this issue?
Here is a simplified version of what I have tried:
<body>
<div class="site-wrapper wrapall">
<div id="page-wrap">
<div id="content" class="page-section nopadding">
<div class="wpb_row vc_row-fluid standard-section section section-no-parallax space stretch">
<div class="col span_12 color-dark left">
<div class="vc_col-sm-12 wpb_column column_container col no-padding color-dark">
<div class="wpb_wrapper">
<div id="MYROW" class="vc_row wpb_row vc_inner vc_row-fluid EQUALHEIGHT">
<div id="MYCOLUMN1" class="wpb_column vc_column_container vc_col-sm-4">
<div class="vc_column-inner">
<div class="wpb_wrapper">
...content...
</div>
</div>
</div>
<div id="MYCOLUMN2" class="wpb_column vc_column_container vc_col-sm-4">
<div class="vc_column-inner">
<div class="wpb_wrapper">
...content...
</div>
</div>
</div>
<div id="MYCOLUMN3" class="wpb_column vc_column_container vc_col-sm-4">
<div class="vc_column-inner">
<div class="wpb_wrapper">
...content...
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
My current CSS looks like this:
.EQUALHEIGHT .wpb_column,
.EQUALHEIGHT .vc_column-inner,
.EQUALHEIGHT .wpb_wrapper {
height: 100%;
}
However, setting the height only works if I give #MYROW a fixed height. I want the parent's height to dynamically adjust based on its children. Does anyone know how to achieve this within the WPBakery Builder and Minti Themes environment?
If you have any suggestions or solutions, please let me know. Thank you!