używamword-break: break-all; i chcesz wiedzieć, w jaki sposób przeglądarka może automatycznie wstawićmyślniki, jak pokazano wPrzykład MDN.

div {
  width: 80px;
  height: 80px;
  display: block;
  overflow: hidden;
  border: 1px solid red;
  word-break: break-all;
  hyphens: auto;
  -ms-hyphens: auto;
  -moz-hyphens: auto;
}

<div>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>

Takie, że tekst wyglądałby tak:

aaaaaaaa-
aaaaaaaa-
aaaaaaaa-
aaaaaaaa

StworzyłemJSFiddle zbyt.

Musi to działać w IE9 / IE10, ale byłoby fajnie, gdyby działało również w Firefoksie i Chrome.