CSS | Match dynamic div heights inside row
<p>feel free to rephrase my question title, I couldn't think of how to word it correctly.</p>

<p>Having some CSS related issues.I have a row element (not to be confused with bootstrap this is separate). and inside this I have two columns.</p>

<p>the columns are both dynamic in the sense that on resize they change height. how can I get the divs to match the tallest element.</p>

<p>I am trying to find a way to do this with <strong>Pure</strong> CSS. Hopefully the image below explains my theory more</p>

<p><a href="https://i.stack.imgur.com/APwjP.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/APwjP.png" alt="enter image description here"></a></p>

<p>My real example is below, I need the first column ( the one with the line in ) to match the height of the form div both contained within the row</p>

<p><a href="https://i.stack.imgur.com/upff7.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/upff7.png" alt="enter image description here"></a></p>