JSFiddle - React, Tailwind, and code Playground

by John Grivas

HTML

<div class="content">
    <p>.<span class="accent" data-meta="Unfortunately it is aligned with the last line of said span.">2.Etiam leo ligula, laoreet eget urna et, dignissim facilisis nisi ante.</span> </p>
</div>

CSS

.content p {
    width: 62.069%;
}
.accent {
    
}
.accent:after {

}
.accent::after {
    content: attr(data-meta);
position: absolute;
right: 0;
width: 31.035%;

    border: solid 1px red;
  }
.accent {
  color: cornflowerblue;

}