JSFiddle - React, Tailwind, and code Playground

by toubia95

HTML

<p>
<span class="a">Je</span><span class="a b"> </span><span class="b c">suis</span><span class="a c"> </span><span class="b">en</span><span class="c"> </span><span class="a b c">train</span><span class="a b c"> </span><span class="a b c">de</span><span class="a b c"> </span><span class="a b c">tester</span><span class="a b c"> </span><span class="a b c">l'</span><span class="a b c">imbrication</span><span class="a b c"> </span><span class="a b c">des</span><span class="a b c"> </span><span class="a b c">balises</span><span class="a b c">.</span><br><span class="a b c">Je</span><span class="a b c"> </span><span class="a b c">suis</span><span class="a b c"> </span><span class="a b c">en</span><span class="a b c"> </span><span class="a b c">train</span><span class="a b c"> </span><span class="a b c">de</span><span class="a b c"> </span><span class="a b c">tester</span><span class="a b c"> </span><span class="a b c">l'</span><span class="a b c">imbrication</span><span class="a b c"> </span><span class="a b c">des</span><span class="a b c"> </span><span class="a b c">balises</span><span class="a b c">.</span>
</p>

CSS

.a {
  border-bottom: 3px solid red;
}
.b {
  border-bottom: 2px solid blue;
}
.c {
  border-bottom: 1px solid green;
}