<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style>
</style>
</head>
<body>
<div class="el">Далеко-далеко за словесными горами в стране, гласных и XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX живут рыбные тексты. Дороге запятых если эта, что свой своих щеке, наш на берегу буквоград одна она подпоясал даль переписывается текст до даже строчка.</div>
<script>
var el = document.querySelector(".el");
(splitWord=function(){
if(el.scrollWidth>= innerWidth) {
el.style.fontSize='11px';
text = el.textContent.split(' ');
word = text.sort((a,b)=> b.length-a.length)[0];
el.textContent = el.textContent.replace(word, word.slice(0,Math.floor(word.length/2))+' '+word.slice(Math.floor(word.length/2)) );
}
})();
onresize = splitWord;
</script>
</body>
</html>
Делится будет до тех пор пока не поместится без горизонтального скрола