JSFiddle - React, Tailwind, and code Playground
HTML
<div id="hide">
<div class="div1">Hello World</div>
<div class="div2">This is really really really really really really really really long.</div>
</div>
CSS
#hide
{
position: relative;
border: 1px solid #f00;
width: 100px;
height: 100px;
overflow: hidden;
}
#hide div
{
position: absolute;
}
#hide .div1
{
height: 100%;
top: 0;
left: 0;
width: 50px;
}
#hide .div2
{
top: 0;
left: 50px;
width: 50px;
}
JavaScript
var hider= $("#hide");
var height= $(hider).height();
//alert( width );
$(hider).children().each(function()
{
//alert($(this).attr('class'));
if( $(this).height() > height)
alert('too high' + $(this).attr('class'));
});