Ambos para word-wrap: break-word; y overflow-wrap: break-word; Propiedades CSS Tengo un problema de interrupción prematura al final, como en este caso. Además, con cadenas más largas, incluso presencié que este problema se manifestaba de diferentes formas, como no romperse en absoluto en el extremo esperado de la línea o inventar un ancho más ancho o más estrecho para el resto de las líneas.
La pregunta es, cuando tienes una cadena muy larga, ¿por qué overflow-wrap: break-word; "romper" en ciertos lugares inesperados ..?
var str = Array.from({length:65366}, _ => ~~(Math.random()*9) + 1) .reduce((s,c) => s + c, ""), blk = document.getElementById("block"); blk.textContent = str; #block{ margin : 0 auto; font-family: monospace; width: 90vw; overflow-wrap: break-word; } <p id="block"></p>Nota: este problema no parece existir en Firefox, pero puedo verlo en Chrome y Edge. Además, mientras se desplaza hacia abajo, puede notar que el margen derecho cambia.