JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr>
        <td style="font-size: 10px;">            
                <span class="edit-icon glyphicon glyphicon-pencil"> </span>
            <div class="content">
                <p>Content</p>
                <p>More content</p>
                <p>Even more content</p>
                <p>So much more content</p>            
            </div>
        </td>
    </tr>
    <tr>
        <td style="font-size: 10px;">            
                <span class="edit-icon glyphicon glyphicon-pencil"> </span>
            <div class="content">
                <p>Content</p>
                <p>More content</p>
                <p>Even more content</p>
                <p>So much more content</p>            
            </div>
        </td>
    </tr>
</table>

CSS

td
{ 
    position:relative;
    display:block;
    height:300px;
    width:300px;
    background-color:grey;       
}

span
{
    position:absolute;
    top:5px;
    right:5px;    
    height:100px;
    width:100px;
    background-color:red;    
}

.content
{
    position:absolute;
    top:50%;
    -webkit-transform:translateY(-50%);
    transform:translateY(-50%);
}