JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
    <div class="text">
        <div class="inner">Text aligned at bottom, text aligned at bottom, text aligned at bottom, text aligned at bottom, text aligned at bottom.</div>
    </div>
    <div class="photo">
        <div class="inner"><img id="photograph" src="//dummyimage.com/140" /></div>
    </div>
</div>

CSS

.wrapper {
    border: 1px solid blue;
    overflow: auto;
}
.wrapper .text {
    float: left;
    width: calc(100% - 140px);
}
.wrapper .photo {
    float: right;
}
.wrapper .inner {
    display: table-cell;
    height: 140px;
    vertical-align: bottom;
}
.wrapper .inner img {
    display: block;
}