JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
    <div class="rotateObj">
        <h2 class="active"><span>First title</span></h2>
        <div class="content">
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua
        </div>
        <h2><span>Second title</span></h2>
        <div class="content">
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua
        </div>
    </div>
</div>

CSS

.wrapper {
    margin:0 auto;
    width:960px;
    background:#EFEFEF;
}

.rotateObj {
    height:150px;
}

.rotateObj h2 {
    position:relative;
    float:left;
    background:gray;
    width:50px;
    height:100%;
    border-radius:5px;
    -moz-border-radius:5px;
}

.rotateObj h2 span {
    width:150px;
    display:inline-block;
    position:absolute;
    left:-50px;
    -webkit-transform:rotate(-90deg);
}

.rotateObj h2.active {
    background:green;
}

.rotateObj .content {
    float:left;
    width:250px;
    height:100%;
    padding:20px;
}