I need to align the list items in two separate containers, Both the list items can have variable height , I need to align the first list item of one container from the first list item of second container. This is achievable if I take the height of bigger list item out of corresponding list item.I cannot set maxheight specifically since the contents are dynamic and I cannot apply tables or grids since both list items are inside two seperate divs.
<div class="d-flex justify-content-center mt-5">
<div class="col-10 pre-ee_card_container">
<div class="pre-ee_card mb-5 mb-sm-0">
<h3>Standard Plan</h3>
<ul class="right-arrow-bullet">
<li>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quo doloribus voluptate ex accusantium nulla, explicabo molestias asperiores ipsam. Culpa hic ipsam doloremque impedit totam aliquid vitae maxime iste consequatur libero!</li>
<li>lorum ipsum dolor sit amet consectetur adipis</li>
<li>lorum ipsum dolor sit amet</li>
</ul>
</div>
<div class="pre-ee_card">
<h3>Premium Plane</h3>
<ul class="right-arrow-bullet">
<li>lorum ipsum dolor sit amet</li>
<li>lorum</li>
<li>Lorem ipsum dolor sit amet</li>
</ul>
</div>
</div>