JSFiddle - React, Tailwind, and code Playground

HTML

<div id="outer">
    <div id="inner"> <div>
        <h3>text</h3>
        <h4>text2</h4>
      </div>

    </div>
    <div id="inner2">Other text...</div>
</div>

CSS

html, body {
    margin: 0;
}
#outer {
    background: green;
}
#inner {
    background:#e3e3e3;
    height:100px;
    width:50px;
    float: left;
}
#inner > div {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    line-height: 0;
}

#inner2 {
    margin-left:70px;
    background:#e3e3e3;
}
#inner2::after {
    display: table;
    content:'';
    clear: both;
}