JSFiddle - React, Tailwind, and code Playground

HTML

<head>
  
</head>
<body>
  <div class="container">
    <div class="box">
      <div class="width"></div>
      <img src="http://i.imgur.com/6nZAv.png" height="200" width="300" />
    </div>
    <div class="box">
      <div class="width"></div>
      <img src="http://i.imgur.com/6nZAv.png" height="200" width="350" />
    </div>
    <div class="box">
      <div class="width"></div>
      <img src="http://i.imgur.com/6nZAv.png" height="207" width="150" />
    </div>
    <div class="box">
      <div class="width"></div>
      <img src="http://i.imgur.com/6nZAv.png" height="200" width="100" />
    </div>
  </div>
</body>

CSS

.box {
    float:left;
    margin-left:20px;
    position:relative
  }
  .width {
    position:absolute;
    left:0;
    top:0;
    color:red;
    font-size:20px;
  font-weight:bold;
  }

JavaScript

(function (){
    $('.box').each(function (){
        var $this = $(this);
        var height= $this.find('img').height();
        var width=  $this.find('img').width();
        foreach(width as =>a)
        {
        $this.find('.width').text(a);
        }
    })
})();