Leaflet - modal opens behind map

Question

I'm using leaflet and modalcss to display a modal within a map. This worked like a charm with leaflet v0.7.7. See this Plunker: click --> Click the button under the zoom controls.

When I switch to leaflet v1.2.0 the modal gets opened but behind the map. See this Plunker: click

Why is this happening? Any idea on how to show the modal in front of the map like in the old version of leaflet? Thanks!

Answer 1

Apply this CSS rules to map and model:

#map{ z-index:1; }
#modal{ z-index:2; }