JSFiddle - React, Tailwind, and code Playground

by rdillman

HTML

<html>
<head>
</head>
<body>
    <h1> ... </h1>
    <br />
    <div class="text">
        Lorem
        <span class="B outer">ipsum <span class="A">dolor</span> sit</span> amet,
        consetetur sadipscing elitr, sed
        diam nonumy eirmod tempor
        invidunt ut labore et dolore
        magna aliquyam erat, sed diam
        voluptua.
    </div>
    <br />
    <br />
    <div class="text">
          Lorem ipsum dolor sit amet,
        consetetur sadipscing elitr, sed
        diam
        <span class="B outer">
            <span class="A">nonumy eirmod</span></span>
        tempor
        invidunt ut labore et dolore
        magna aliquyam erat, sed diam
        voluptua.
        
   
    </div>
    <br />
    <div class="text">   
        Lorem ipsum dolor sit amet,
        consetetur sadipscing elitr, sed
        diam nonumy eirmod tempor
        <span>invidunt</span>
        <span>ut</span>
        labore et dolore
        magna aliquyam erat, sed diam
        voluptua.
    </div>
     <br />

    <div class="text">
        Lorem ipsum dolor sit amet,
        consetetur sadipscing elitr, sed
        <span>
          <span>diam nonumy</span> 
          <span>eirmod</span>
         </span>
         <span>tempor</span>
        invidunt ut labore et dolore
        magna aliquyam erat, sed diam
        voluptua.
    </div>
       <br />

    <div class="text">
        Lorem ipsum dolor sit amet,
        consetetur sadipscing elitr, sed
        <mark><mark>diam nonumy</mark><mark><mark>eirmod</mark></mark><mark>tempor</mark></mark>
        invidunt ut labore et dolore
            magna aliquyam erat, sed diam
        voluptua.
    </div> 
</body>
</html>

CSS

html {
    font-size: 22px;
}

.text {
    width: 300px;
    text-align: justify;
}

div {
    padding-left: 8px;
}


span {
    background: rgba(244, 247, 118, 0.5);
    padding: 2px;
    margin: 0px;
    border: 1px solid green;
}

span > span {
    padding: 4px;
}

span > span > span {
    padding: 6px;
}

span > span > span > span {
    padding: 8px;
}