JSFiddle - React, Tailwind, and code Playground

by charlescarver

HTML

<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1" />
<p>This <span class="highlight">line will break here
    <b data='&#xa;'></b>
    and then continue onto this line, which is pretty large and will continue on</span> and on <span class="break"></span>
Paragraph break!</p>

CSS

body {
    line-height:25px;
}
[data]:after {
    content: attr(data);
    white-space: pre;
    height: 0;
}
.highlight {
    background-color:red;
}
.break {
    display:inline-block;
    height:15px;
    width:100%;
}