JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<div class="classroom">
    <div class="student">
        <img class="student-image" src="http://dnqgz544uhbo8.cloudfront.net/_/fp/img/home/f.AmzRdUdc4pEtCuGvU03WXQ.jpg">
    </div>

    <div class="student">
        <img class="student-image" src="http://dnqgz544uhbo8.cloudfront.net/_/fp/img/home/k.jXX55KhHUWZGTAb-GpPkdg.jpg">
    </div>

    <div class="student">
        <img class="student-image" src="http://dnqgz544uhbo8.cloudfront.net/_/fp/img/home/c.ZKQXc2Kc8-po-OK6AhDbtw.jpg">
    </div>
</div>

CSS

body {
  padding: 0;
  margin: 0;
  overflow: hidden;
}

html, body {
    height: 100%;
}


.classroom {
    position: relative;
    height: 100%;
}

.classroom .student {
    position: relative;
    height: 100%;
    float: left;
}

.classroom .student .student-image {
    height: 100%;
}

JavaScript

$(document).ready(function() {
    var w = 0;
    $(".student").each(function() {
        w += $(this).width();
    });
    $(".classroom").width(w+1);
});