JSFiddle - React, Tailwind, and code Playground

HTML

<div id="topHeader">
  <div id="suiteBar">suiteBar</div>
  <div id="ribbon">sanjay
    <div id="ribbonSub">ribbonSub</div>
  </div>
    <div class="clr"></div>
</div>

CSS

.clr{ clear:both;}
#topHeader { 
    width:100%; position:relative; z-inex:0;
}
#suiteBar {
    background-color: Aqua;
    position:absolute; top:0px; right:0px;
    width:20%; z-inex:1;
}
#ribbon {
    background-color: Lime;
    width: 100%;
}
#ribbonSub {
    width:100%;
    background-color: Gray;
}