JSFiddle - React, Tailwind, and code Playground
HTML
<div id="outer">
<span id="text">My Vertical Text</span>
<img id="img" src="http://www.gizmodo.com/assets/resources/2007/01/Bill-gates-mugshot.jpg" />
</div>
CSS
#outer {
border: solid 1px red;
width:600px;
height: 600px;
position: relative;
}
#text {
-webkit-transform: rotate(-90deg);
-webkit-transform-origin: left top;
-moz-transform: rotate(-90deg);
-moz-transform-origin: left top;
-o-transform: rotate(-90deg);
-o-transform-origin: left top;
transform: rotate(-90deg);
transform-origin: left top;
position: absolute;
bottom: 0;
left: 5px;
}
#img {
position:absolute;
bottom: 15px;
left: 30px;
}