JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://code.jquery.com/jquery-latest.min.js"></script>
<div id="parent">
<div id="child1" class="child">
</div>
<div id="child2" class="child">
</div>
</div>
CSS
#parent {
width:100px;
height:auto;
position:relative;
background-color:#f00;
}
#parent #child1 {
position:absolute;
height:50px;
width:90%;
margin:0px 0px 0px 10%;
background-color:#0f0;
}
#parent #child2 {
position:absolute;
height:60px;
width:90%;
margin:5px 0px 0px 10%;
background-color:#00f;
bottom:0px;
}
JavaScript
var height = 0;
$("#parent .child").each(function() {
height = height + $(this).outerHeight(true);
});
$("#parent").height(height);