JSFiddle - React, Tailwind, and code Playground

HTML

<!doctype HTML>
<html>
    
    <body>
        <div class="outerContainer">
            <div class="threeDivContainer">
                <div class="nonFixedWidth"></div>
                <div class="nonFixedWidth2"></div>
                <div class="nonFixedWidth3"></div>
            </div>
        </div>
    </body>

</html>

CSS

.outerContainer {
    float: left;
    position: relative;
    left: 50%;
}
.threeDivContainer {
    float: left;
    position: relative;
    left: -50%;
}
.nonFixedWidth {
    width: 75px;
    height: 100px;
    background-color: black;
    float: left;
}
.nonFixedWidth2 {
    width: 29px;
    height: 100px;
    background-color: blue;
    float: left;
}
.nonFixedWidth3 {
    width: 90px;
    height: 100px;
    background-color: red;
    float: left;
}