CODEWITHSUNDEEP
javascriptmodal-dialogzurb-foundationoverlayzurb-reveal
Cjolly
Cjolly

Reputation: 500

Foundation 6 reveal modal act like overlay and modal box obscured by overlay

Using the example Foundation reveal modal I get a dialog box that is obscured by the overlay. I find it impossible to get the dialog box to show on top of the overlay. I have manipulated the z-index of both the dialog box and the overlay to be 1006 and 1 respectively and still the overlay obscures the dialog box. According to the Inspecting tools (Chrome) the overlay div has a z-index of 1005 and the dialog div at 1006 by default so the overlay should not obscure the dialog div. What is going on? I've also tested this in firefox with same bad results. As a workaround, I've updated my css overides to hide the overlay using :

.reveal-overlay {
display: none !important;

}

But I'd like to have the overlay to indicate to the user that they must deal with the modal dialog.

Upvotes: 2

Views: 488

Answers (1)

Cjolly
Cjolly

Reputation: 500

After much experimentation, the solution was very simple. Place the modal div at the very bottom of the body. All of a sudden it worked.

Upvotes: 2

Related Questions