JSFiddle - React, Tailwind, and code Playground

by mjisrawi

HTML

<div class="box">
   <span class="title">Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec sed odio dui.</span><br />
   <span class="text">
   Aenean lacinia bibendum nulla sed consectetur. Donec ullamcorper nulla non metus auctor fringilla. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Integer posuere erat a ante venenatis dapibus posuere velit aliquet.

Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo. 
   </span>
</div>

CSS

.box {
    width:100px;
    display: table;
    border: 1px solid #000;
}

.box span.title {
    font-size:24px;
    white-space: nowrap;
    background: #FF0000;
    color: #FFF;
}

.box span.text{
    font-size:10px;
    white-space: normal;
    background: #CCC;
}