JSFiddle - React, Tailwind, and code Playground

HTML

<!-- content to be placed inside <body>…</body> -->
<div class="graph">
    <div style="height: 22px;" class="weekbar start"></div>
    <div style="height: 11px;" class="weekbar"></div>
    <div style="height: 6px;" class="weekbar"></div>
    <div style="height: 49px;" class="weekbar"></div>
    <div style="height: 11px;" class="weekbar"></div>
    <div style="height: 6px;" class="weekbar"></div>
    <div style="height: 6px;" class="weekbar"></div>    
    <div style="height: 6px;" class="weekbar"></div>
    <div style="height: 49px;" class="weekbar"></div>
    <div style="height: 28px;" class="weekbar end"></div>
</div>

CSS

* {
    padding: 0px;
    margin: 0px;
}
.graph {
    width: 100%;
    height: 50px;
    background-color: #eaeaea;
    font-size:0;
}
.weekbar {
    width: 6.4%;
    margin-left: 2%;
    margin-right: 2%;
    display: inline-block;
    position: relative;
    background-color: #aeaeae;
    vertical-align: baseline;
}
.start {
    margin-left: 0px;
}
.end {
    margin-right: 0px;
}