I have a very simple CSS grid
<div style='display: grid; grid-template-columns 2fr 1fr; gap: 1em'>
<div>
This is Column A. Sometimes this will have more content than Column B
so it will have a larger height, which is correct. But sometimes it will
have LESS content than Column B. In which case, the grid should still only
ever be as tall as this column, and column B should adjust it's size
respectively
</div>
<div>
This is Column B. The height of this columns should ALWAYS match the height
of column A. If the content of this column is taller than that of column A,
then the height of this column should be adjusted to match Column A.
</div>
</div>
Is there any way, using CSS only, to have the HEIGHT of the row(or entire grid; as there will only ever be one row) to ALWAYS match that of the content of Column A?