JSFiddle - React, Tailwind, and code Playground

HTML

<section id="graphs">
    <span id="tooltip">thisistest</span>    
    <canvas id="myChart" width="550" height="350"></canvas>
</section>

CSS

/This part works
#myChart{
    background-color: black;
}
#tooltip {
    display: none;
    position: relative;
    top: 8px; 
    left: 10px;
    padding: 5px; 
    margin: 10px;
    z-index: 100;
    background: #333;
    border: 1px solid #c0c0c0;
    opacity: 0.8; 
    width: 300px;
    color: black;
    text-align: left;
    
}

#graphs:hover #tooltip{
     display: block;   
}

#graphs{
 background-color: red;   
}