JSFiddle - React, Tailwind, and code Playground

HTML

<div class="panel panel-default preview-container ">
            <div class="panel-heading">
                <h3 class="panel-title blurb-title">This is the title of my post. </h3>
                <a href="#" class="btn btn-success btn-large round sentiment-btn-custom">34%</a>
            </div>
            <div class="panel-body body-container">
                <!--<div class="img-container">
                </div>-->
              
                <div class="text">
                  <img src = "http://static.ddmcdn.com/gif/dog-breed-dog-breed-pictures1.jpg" style="float:left; margin-right: 5px;" height = "116" width = "116" alt = "Page image"/>
                    <p>
                labore et dolore magna aliqua. Ut enim ad minim luptate velit esse cillum dolore eu fugiat dfdflabore et dolore magna aliqua. Ut enim ad minim luptate velit esse cillum dolore eu fugiat dfdflabore et dolore magna aliqua. Ut enim ad minim luptate velit esse cillum dolore eu fugiat dfdf</p>
                    <!--<p class="read-more-container"><a target="_blank" href="#" class="read_more">Read More</a></p>-->
                </div>
            
            <div>
                <div class="footer-working-area">
                    <!--<i class="glyphicon glyphicon-time"></i> November 19, 2013 -->
                    <a href="#" class="comments"><span class="badge">5 comments</span></a>
                    <a href="#" class="share"><i class="fa fa-share"></i></a>
                </div>
            </div>
            </div>

CSS

.footer-working-area {
    background: transparent url(http://static.tumblr.com/snnreod/XQ4l8fk2n/tiny_dots.png) top left repeat-x;
    padding: 1em 0;
}

.preview-container {
    display: block;
    width: 500px;
    box-shadow: 0 1px 5px rgba(0,0,0,.6);
    background-color: #f8f8f8;
    margin: 30px auto;
}

.body-container {
    margin: 0 5% 0 5%;
}

.img-container {
    width: 160px;
    height: 160px;
    float: left;
    background: transparent url(http://static.tumblr.com/snnreod/SFKl8fjp5/album_art.jpg) top left no-repeat;
}

.read-more-container {
    margin-bottom: 1.1em;
}

.text::after {
    content: "";
    display: block;
    clear: both;
}
.text p {
    margin-bottom: 1.1em;
    color: #424242;
    font: 0.9em Georgia;
    line-height: 130%;
}

.comments {
    padding-left: 0.3em;
    font-size: 0.8em;
}

.share {
    float: right;
    padding-left: 0.3em;
}

.sentiment-btn-custom {
    background-color: hsl(0, 47%, 38%) !important;
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#cb7070", endColorstr="#8e3333");
    background-image: -khtml-gradient(linear, left top, left bottom, from(#cb7070), to(#8e3333));
    background-image: -moz-linear-gradient(top, #cb7070, #8e3333);
    background-image: -ms-linear-gradient(top, #cb7070, #8e3333);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cb7070), color-stop(100%, #8e3333));
    background-image: -webkit-linear-gradient(top, #cb7070, #8e3333);
    background-image: -o-linear-gradient(top, #cb7070, #8e3333);
    background-image: linear-gradient(#cb7070, #8e3333);
    border-color: #8e3333 #8e3333 hsl(0, 47%, 32%);
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.39);
    -webkit-font-smoothing: antialiased;
    color: #FFF;
}

.round {
    position: relative;
    overflow: hidden;
    border-radius: 500px;
    float: right;
}

.blurb-title {
    display: inline-block;
    width: 70%;
}




/*!
 * Bootstrap...