JSFiddle - React, Tailwind, and code Playground

HTML

<div id="test1">wonderland wonderland test wonderland wonderland</div>
<br>
<div id="test2">wonderland wonderland test wonderland wonderland</div>
<br>
<div lang="en" id="test3">wonderland wonderland test wonderland wonderland</div>

CSS

div {
    border: 1px solid red;
    width: 170px;
}

#test1 {
    word-wrap: break-word;
}

#test2 {
    word-break: break-all;
}

#test3 {
    -moz-hyphens: auto;
}