JSFiddle - React, Tailwind, and code Playground

HTML

<div class="card" dir="rtl">
    <div class="inner">
        <div id="person-photo">
            <img src="http://tinyurl.com/mwy4v3h" class="photo"/>
        </div>
        <div class="inline-container">
            <div id="details">hello</div>
        </div>
    </div>
</div>

CSS

.card {
  text-align: right;
  background-color: blue;
  color: white;
  height: 300px;
}

.card .inline-container {
  display: inline-block;
}

.card #person-photo {
  display: inline-block;
  vertical-align: middle;
}

.inner {
    position: relative;
    top: 10%;
}

.inline-container {
    position: relative;
    top: 30%;
}

.card #person-photo, .card #details {
  position: relative;
}