JSFiddle - React, Tailwind, and code Playground

by soulwire

HTML

<script src="https://rawgithub.com/soulwire/fit.js/master/fit.js"></script>
<div class="foo">
    <div class="bars">
        <div class="bar"></div>
        <div class="bar"></div>
        <div class="bar"></div>
    </div>
</div>

CSS

.foo {
    background: #eee;
    margin: 20px auto;
    height: 100px;
    width: 400px;
}

.bars {
    position: absolute;
    overflow: hidden;
}

.bar {
    background: #e74c3c;
    margin: 0 1px;
    height: 50px;
    float: left;
    width: 30px;
}

JavaScript

var foo = document.querySelector( '.foo' );
var bars = document.querySelector( '.bars' );

fit( bars, foo );