JSFiddle - React, Tailwind, and code Playground

by daker

HTML

<h1>Normal</h1>

<p class="none">Lorem ipsum dolor sit amet, cons&shy;ectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exer&shy;citation ullamco laboris nisi ut aliquip ex ea com&shy;modo consequat. Duis aute irure dolor in repre&shy;henderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui of&shy;ficia deserunt mollit anim id est lab&shy;orum.</p>

<h1>Manual</h1>

<p class="manual">Lorem ipsum dolor sit amet, cons&shy;ectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exer&shy;citation ullamco laboris nisi ut aliquip ex ea com&shy;modo consequat. Duis aute irure dolor in repre&shy;henderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui of&shy;ficia deserunt mollit anim id est lab&shy;orum.</p>

<h1>Auto</h1>

<p class="auto">Lorem ipsum dolor sit amet, cons&shy;ectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exer&shy;citation ullamco laboris nisi ut aliquip ex ea com&shy;modo consequat. Duis aute irure dolor in repre&shy;henderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui of&shy;ficia deserunt mollit anim id est lab&shy;orum.</p>

CSS

p.none {
    hyphens: none;
    -moz-hyphens: none;
    -ms-hyphens: none;
}
p.manual {
    hyphens: manual;
    -moz-hyphens: manual;
    -ms-hyphens: manual;
}
p.auto {
    hyphens: auto;
    -moz-hyphens: auto;
    -moz-hyphens: manual;
}