Looking for help with a div containing some html that creates a complex graph. The goal is to add labels at the top and bottom of the graph, overlaying the graph div, while covering 10% of the top and bottom areas of the graph div.
In the mock example below, only the bottom label appears properly. How can I overlay the top label on the graph div? What element am I missing? Can this be accomplished as a percentage of the graph div area?
<div class="position-relative">
<div style="position:absolute; z-2">
<h2 style="background-color:grey;" >Top Label</h2>
</div>
<div style="height:100px; width:100px; margin-top:40px; margin-left:20px; background-color:red; position:absolute;">
GRAPH
</div>
<div style="height:100px; width:100px; margin-top:90px;
background-color:orange; position:absolute; z-1;">
<h2>Bottom Label</h2>
</div>
</div>