JSFiddle - React, Tailwind, and code Playground

HTML

<div class="author-data">
    <h1><span>Professora</span> Ivana Almeida </h1>
    <figure class="contributor-icon">
        <img alt="Ivana Almeida" title="Ivana Almeida" src="https://fbcdn-sphotos-a-a.akamaihd.net/hphotos-ak-xtp1/v/t1.0-9/10934073_523020214504379_9188361152173939468_n.jpg?oh=89e1ca848ef614fd65c1c86222860807&oe=5841BA5D&__gda__=1480505451_dce33336877c27dbd710c546f7ad8cce">
    </figure>

    <h3>Aulas de Reforço na Língua Inglesa</h3>
</div>

CSS

.author-data {
    position: relative;
    display: table-cell;
}

.author-data h1 {
    background: #e9e9e9 url("css/img/dot.gif") repeat-x scroll center top;
    font-size: 24px;
    font-weight: bold;
    line-height: 20px;
    margin: 30;
    padding: 15px 0 15px 120px;
    text-transform: uppercase;
    color: #61262a;
    vertical-align: top;

}

.author-data .contributor-icon {
    background: #fff none no-repeat scroll 0 0;
    border: 2px solid #e9e9e9;
    border-radius: 50%;
    box-sizing: content-box;
    display: inline-block;
    height: 80px;
    left: 25px;
    margin-top: -40px;
    overflow: hidden;
    position: absolute;
    text-align: center;
    width: 80px;
}

figure {
    margin: 0;
    text-align: center;
    background: #eee;
    margin-bottom: 40px;
}

.author-data h3 {
    font-size: 20px;
    line-height: 1.125;
    margin: 30px 0 0;
    padding: 10px 20px 15px 120px;
    word-wrap: break-word;
    color: #333;
    border-bottom: 3px solid #ddd;
    min-height: 73px;
}

.contributor-icon img {
    width: 200px;
    height: 200px;
    margin: -100px 0 0 -50px;
}