JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<div class="parentElement">
    <div class="children"></div>
    <div class="children"></div>
    <div class="children"></div>
</div>

CSS

.parentElement {
    width: 235px;
    height: 100px;
    background: #ffffff;
    border: 1px solid #000000;
}
.children {
    display: inline-block;
    width: 75px;
    height: 75px;
    background: #000000;
}

JavaScript

jQuery(document).ready(function ($) {
    $('.parentElement').resizable({
        resize: function (e, ui) {
            var thisw = $(this).outerWidth();
            var thish = $(this).outerHeight();

            $(this).find("*").each(function (i, elm) {
                elw = $(elm).outerWidth();
                elh = $(elm).outerHeight();
                wr = parseFloat(elw) / parseFloat(thisw);
                hr = parseFloat(elh) / parseFloat(thish);
                w = elw * wr;
                h = elh * hr;
                $(elm).css({
                    "width": w,
                        "height": h
                });
            });
        },
    });
});