JSFiddle - React, Tailwind, and code Playground
HTML
<div class="div-cless">
asdasf asf asfdda
</div>
<div class="div-cless">
asdasf asf
</div>
CSS
div {
width:160px;
text-overflow:ellipsis;
overflow:hidden;
white-space:nowrap;
text-transform: uppercase;
}
JavaScript
$(function() {
$('div').each(function(i) {
if (isEllipsisActive(this))
$(this).css({'color':'red'});
else
$(this).css({'color':'green'});
});
});
function isEllipsisActive(e) {
return (e.offsetWidth < e.scrollWidth);
}