JSFiddle - React, Tailwind, and code Playground

by Radiocity

HTML

<div id="outer">
    <div id="inner">
        Если ширина ниже 300*80px,
        <br/>прячем контент<br/>
        <span style="color:#b91c19;" id="status"></span>
    </div>
</div>

CSS

#inner{
 width: 284px;
 min-width: 284px;  
 background: #f0f0f0;   
 color: #333; 
 padding: 8px;  
 margin:0 auto;    
 min-height: 64px;
 height: 64px;
 white-space:normal;
 line-height:18px;
}

#outer{
 white-space:pre-wrap;
 line-height:80px;
 overflow:hidden;
 border-bottom:1px dashed #b91c19;
}

JavaScript

/* Текущая ширина */
function lol(){
var w = $('#outer').width();
 $('#status').text(Math.floor(w) + 'px');
};

lol();

$(window).resize(function() {
    lol();
});