JSFiddle - React, Tailwind, and code Playground

by Ken Watanabe

HTML

<div class="image-wrap"><img class="image-inner" src="http://media.creativebloq.futurecdn.net/sites/creativebloq.com/files/images/2013/08/korea5b.jpg" alt="" /><div class="image information">information<br/>informa<br/>info</div></div>

CSS

.image.information {
	display:block;
	position:absolute;
	margin:0;
	top:45%;
	left:100%;
	height:100%;
	-webkit-transition:all 250ms linear;
	-o-transition:all 250ms linear;
	transition:all 250ms linear;
	transform:rotate(-90deg);
	-webkit-transform:rotate(-90deg);
	-moz-transform:rotate(-90deg);
	-ms-transform:rotate(-90deg);
	-o-transform:rotate(-90deg);
	filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
	}

.image-wrap {
    height: 100%;
    width: 100%;
    display: block;
}

.image-inner img {
    width: 500px;
    height: auto;
    display: block;
}