Menu icon Foundation
Can't get close-reveal-modal to be position:fixed

I want the close "X" to be fixed b/c the content inside the modals is so long but I can't seem to override the foundation styles for it's positioning.

Here is my URL:
http://fosinacreative.com/clients/Harlequin/2015_02_Harlequin_100/LP/www/LP1.html

Click on "Read an excerpt"

close-reveal-modal

I want the close "X" to be fixed b/c the content inside the modals is so long but I can't seem to override the foundation styles for it's positioning.

Here is my URL:
http://fosinacreative.com/clients/Harlequin/2015_02_Harlequin_100/LP/www/LP1.html

Click on "Read an excerpt"

Rafi Benkual over 4 years ago

This not so much an issue of overriding the styling. You can fixed position it to the top right corner of the screen but not to reveal modal because that is an absolutely positioned element and the browser doesn't know where it is on the screen.

But the background closes the modal also.

Michael LaRoy over 4 years ago

it is (sort of) possible if you change the reveal-modal itself from

reveal-modal {  
 position:absolute;
}

to

reveal-modal {  
 position:fixed;
}

You then have to make the close-reveal-modal position:fixed as well, position it accordingly, and possibly adjust for screen sizes.