JSFiddle - React, Tailwind, and code Playground

by tebrown

HTML

<a class="ts-default-link" href="">
<div class="ts-default-overlay " style="left: 40px; top: 41px">
<h2 class="ts-default-title">Hello my name is dfgdfdfg gdf gfddfgdfg fdgdfgd fgdf gdfgdf g df</h2>
    </div>
</a>

CSS

.ts-default-overlay .ts-default-title {
    background: none repeat scroll 0 0 yellow;
    color: #000 !important;
    display: inline;
    font: 24px/2em Georgia,serif;
    left: 20px;
    margin: 0 0;
    padding: 2px;
    position: relative;
    width: 200px !important;
    line-height: 100px;
    
}
.entry-content h1, .entry-content h2, .comment-content h1, .comment-content h2 {
    color: rgb(56, 56, 56);
    font-size: 28px;
    font-weight: bold;
    margin: 0 0 0.1em;
    width: 200px;
    text-decoration: none;
}
.ts-default-title {
    padding: 15px !important;
    text-decoration: none;
}

a{
    text-decoration: none;
}

.ts-default-overlay {
    padding: 5px 11px 11px;
    position: absolute;
    text-align: left !important;
    width: 300px;
}