JSFiddle - React, Tailwind, and code Playground

by SaulBurgos

HTML

<div class="container">
    <div class="container_item">
        1
    </div>
    <div class="container_item">
        1
    </div>
    <div class="container_item grow">
        1
    </div>
    <div class="container_item">
        1
    </div>
    <div class="container_item">
        1
    </div>
</div>

CSS

.container {
    display: flex;
    border: 1px dashed green;
    height: 400px;
}
.container_item {
    border: 1px dashed gray;
    width: 15%;
}

.grow {
    flex-grow: 2;
}

.shrink {
    flex-shrink: 2
}