JSFiddle - React, Tailwind, and code Playground

by Jonathan Sampson

HTML

<div class="overModal message">This element will appear above the modal layer.</div>
<div class="message">This element will NOT appear above the modal layer.</div>
<div id="modal"></div>

CSS

#modal {
    background: rgba(0,0,0,.8);
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    z-index: 100;
}
.message {
    background: #f1f1f1;
    color:      #333;
    padding:    10px;
    margin:     10px auto;
    width:      200px;
}
.overModal {
    position: relative;
    z-index: 200;
}