JSFiddle - React, Tailwind, and code Playground

HTML

<div class="table">
  <div class="cell-1">
    <img src="http://www.english3.com/wp-content/uploads/2013/05/DFI-Logo-300px-X-200px.png"/>
   </div>
   <div class="cell-2">
    <div class="info">
      <p>Some text here yeah :).</p>
      <p>Some text here yeah :)</p>
      <p>Some text here yeah :)</p>
      <a class="link" href="#">I should be absolute.</a>
    </div>
  </div>
</div>

CSS

.table {
    overflow: hidden;
    position: relative;
    display: table;
}

.cell-1, .cell-2 {
    display: table-cell;
    width: 50%;
    vertical-align: top;
}

.cell-1 {
    background: red;
}

.cell-2 {
    background: blue;
}

.cell-1 img {
  max-width:100%;  
  display: block; 
 }

.info {
    background-color: blue;
    position:relative;
    height: 100%;
}

.link {
    display: block;
    position: absolute;
    left: 3%;
    bottom: 3px;
    color: yellow;
}