JSFiddle - React, Tailwind, and code Playground

HTML

<div class="chart" style="width:800px; margin-left:auto; margin-right:auto">
	<h4 style="width:600px; margin-left:auto; margin-right:auto">Visitors to StackOverflow</h4>

	      <div class="pink" style="width: 50px;">25 </div><div class="ejector">females</div>
		  <div class="green" style="width: 30px;">15 </div><div class="ejector">males</div>
		 
</div>

CSS

chart div {
    
        text-align: right;
        padding: 3px;
        margin: 1px;
        color: #000;
        width: 600px;
      }
      .green {
        font: 15px sans-serif;
        background-color: green;
        text-align: right;
        padding: 3px;
        margin: 1px;
        color: white;
        height: 20px;
        line-height: 20px;
      }
      .pink  {
        font: 15px sans-serif;
        background-color: #f5c5f2;
        text-align: right;
        padding: 3px;
        margin: 1px;
        color: white;
        height: 20px;
        line-height: 20px;
      }
      
      
  .ejector{
        float:left;
        margin-right: -15px;

      }