JSFiddle - React, Tailwind, and code Playground
HTML
<p id="myp"></p>
<textarea id="mytextarea" rows="8" columns="20"></textarea>
CSS
#myp {
width: auto;
float: right;
visibility: hidden;
font-family:"Arial";
font-size: 12px;
}
#mytextarea {
font-family:"Arial";
font-size: 12px;
}
JavaScript
var myp = document.getElementById('myp');
var textarea = document.getElementById('mytextarea');
mytextarea.innerHTML = "Los\n" +
"usuarios no pueden publicar mensajes para insinuar o instruir a otro(s) miembro(s) para que revisen su cuenta de correo electrónico, su buzón de mensajes privados, o para indicarles de alguna manera que tienen un nuevo mensaje privado o de correo electrónico. Con el objeto de solicitar u ofrecer una respuesta con respecto al tema en cuestión. Tampoco está permitido enviar publicidad u ofertas de servicios no solicitados a través de mensajes privados y/o correo electrónico a otros usuarios de Foros del Web.";
var words = mytextarea.value.split(' ');
var temp = '';
var prev = '';
var lines = [];
var d = '';
for (var i = 0; i < words.length; i++) {
temp = myp.innerHTML;
d = words[i];
myp.innerHTML += d + ' ';
if (myp.offsetWidth >= mytextarea.clientWidth) {
myp.innerHTML = d + ' ';
lines.push(temp);
}
}
lines.push(d);
mytextarea.innerHTML = lines.join('|');