JSFiddle - React, Tailwind, and code Playground

by alexb

HTML

<div>
  <span>
    <img src="https://lsco.scene7.com/is/image/lsco/Levi/clothing/173690930-front-pdp.jpg$thumb_mobile$">
  </span>
  <span>THE PERFECT TEE WOMENS_T2_SS_PRINCESS LE</span>
  <span>24 IoH units EoP</span>
</div>


<br>
<div>ruler</div>

CSS

div {
  background: rgba(200, 0, 0, 0.3);
  width: 200px;
  display: flex;
}

img {
  width: 40px;
}

span {
  background: rgba(0, 200, 0, 0.3);
  /* overflow-wrap: break-word; */
  hyphens: auto;
}

span:nth-child(2) {
  background: rgba(0, 0, 200, 0.3);
}