JSFiddle - React, Tailwind, and code Playground

HTML

<div class="outer-div">
  <img class="image" src="http://www.w3schools.com/images/colorpicker.png">
  <div class="test">Here is some text that I want the outer div to size to without line-breaking.</div>
</div>

CSS

.outer-div {
  display: inline-flex;
  align-items: flex-start;
  max-width: 95%;
  background-color: yellow;
}