JSFiddle - React, Tailwind, and code Playground

HTML

<div class="row">
    <div class="cell1">
        <div class="inner">
            <h2>Cell 1</h2>
            <p>Regardless of content, can I make Cell 1 and Cell 2 the same height so the borders are level?</p>            
        </div>
    </div>
    <div class="cell2">
        <div class="inner">
            <h2>Cell 2</h2>
		</div>
	</div>
</div>

CSS

.row {
    margin-bottom: 0;
    margin-top: 12px;
    width: 100%;
}
.cell1 {
    width: 49%;
    margin-right: 1%;
    float: left;
}
.cell2 {
    width: 49%;
    margin-left: 1%;
    float: left;
}
.inner {
    padding-left: 12px;
    padding-right: 12px;
    border: 1px solid #CCC;
    padding-bottom: 12px;
}

JavaScript

$(document).ready(function() {
    var height1 = $('.cell1 > .inner').height();
    var height2 = $('.cell2 > .inner').height();
    if (height1 < height2) {
        $('.cell1 > .inner').height(height2);
    } else {
        $('.cell2 > .inner').height(height1);
    }
});