JSFiddle - React, Tailwind, and code Playground

by Victor

HTML

<div class="colorKey">
    <div class="yellow"><label> yellow</label> - Part #</div>
        <div class="blue"><label> blue</label> - Part #</div>
        <div class="green"><label> green</label> - Part #</div>
</div>

CSS

.colorKey {
    margin:10px;
    padding:5px;
    border:1px solid #999;
    width:200px;
   
}
.colorKey div {
    margin-bottom:4px;
}
.colorKey div label {
    /* background: yellow; */
    padding: 0 5px;
    margin:0;
    display:inline-block;
    width:50%;
    text-align: center;
}
div.yellow label {background:yellow}
div.blue label {background:blue}
div.green label {background:green}