JSFiddle - React, Tailwind, and code Playground

HTML

<div id="cover-up"></div>
<div id="eniro">
            <iframe style="margin-top:-165px; margin-left:-375px;" height="400" width="1650" src="http://kartor.eniro.se/m/ItqG6">
            </iframe>
  
            </div>

CSS

#eniro{
                    position:relative; 
                    z-index:10; 
                    height:222px; 
                    border:3px solid #929292; 
                    overflow:hidden;
                }
#cover-up {
    position: absolute;
    z-index: 20;
    width: 98%;
    height: 228px;
    background: rgba(255, 0, 0, 0.2)
}

JavaScript

$('#cover-up').click(function() {
    alert('you clicked the map');
});