JSFiddle - React, Tailwind, and code Playground

HTML

EXAMPLE B: Why is BLUE not 100% width like RED is?
<div id="wrapper2">
 <div id="yellow">
 YELLOW
 </div>
 <div id="red">
 RED
 </div>
 <div id="blue">
 BLUE
 </div>
</div>

CSS

#wrapper2 {
    border: 1px solid black;
}

#yellow {

    background:yellow;
    width:100px;
    height:200px;
    float:left;
    margin-right: 50px;
}
#red {
    height:100px;
    background:#FF0000;
    overflow:hidden;/**/
}
#blue {
    height:100px;
    background:#00FFFF;
    overflow:hidden;/**/
}