JSFiddle - React, Tailwind, and code Playground
HTML
<div id="sessionManageWrapper">
<div class="sessionBox activeSession">
<div class="activeCircle sessionActiveGreen" title="Online, active"></div>
<img src="http://i.imgur.com/k0h3WPJ.png">
<div class="sessionSeparator"> </div>
<p>@currentSessLocation</p>
<p>@currentSessDevice</p>
<p>@currentSessIP</p>
<div class="wrap">
<div class="dt">
<div class="dc">
<div class="logoutSessWrapper"><a href="" class="redButton">Sign Out</a></div>
</div>
</div>
</div>
</div>
</div>
CSS
#sessionManageWrapper
{
max-width: 45%;
position:relative;
}
#sessionManageWrapper .sessionBox:not(:last-child)
{
margin-bottom: 5px;
}
.dt{
display:table;
width:100%;
height: 100%;
}
.wrap{
position:absolute;
width:100%;
height:100%;
top:0px;
left:0px;
}
.dc{
display:table-cell;
vertical-align:middle;
}
.sessionBox
{
background-color: #444343;
padding: 4px;
border-radius: 3px;
border: 2px solid grey;
vertical-align: middle;
}
.sessionBox img
{
vertical-align: middle;
height: 32px;
width: 32px;
}
.logoutSessWrapper
{
float: right;
line-height: 15px;
}
.sessionBox p
{
margin: 0;
vertical-align: middle;
display: inline-block;
}
.sessionBox p:not(:last-child)
{
margin-right: 10px;
}
.sessionSeparator
{
background-color: grey;
width: 1px;
height: 24px;
display: inline-block;
vertical-align: middle;
}
.activeCircle
{
-webkit-border-radius:8px;
-moz-border-radius:8px;
border-radius:8px;
border:1px solid #ccc;
width:8px;
height:8px;
display: inline-block;
vertical-align: middle;
}
.sessionActiveGreen
{
background-color: green;
}
.redButton
{
-moz-box-shadow:inset 0px 1px 0px 0px #cf866c;
-webkit-box-shadow:inset 0px 1px 0px 0px #cf866c;
box-shadow:inset 0px 1px 0px 0px #cf866c;
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #d0451b), color-stop(1, #bc3315));
background:-moz-linear-gradient(top, #d0451b 5%, #bc3315 100%);
background:-webkit-linear-gradient(top, #d0451b 5%, #bc3315 100%);
background:-o-linear-gradient(top, #d0451b 5%, #bc3315 100%);
background:-ms-linear-gradient(top, #d0451b 5%, #bc3315 100%);
background:linear-gradient(to bottom, #d0451b 5%, #bc3315 100%);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d0451b', endColorstr='#bc3315',GradientType=0);
background-color:#d0451b;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
border:1px solid...