Programming Exercises

Build a full-page CSS-only modal with an overlay effect.

Hard

Problem Statement

Build a full-page CSS-only modal with an overlay effect.

Sample Output

Clicking the button opens a modal that occupies the entire screen with an overlay.

Limits

Time: 2s · Memory: 256 MB

Code Editor
00:00
<!DOCTYPE html> <html> <head> <style> /* Add CSS here to style the full-page modal */ </style> </head> <body> <button id="open-modal">Open Modal</button> <div class="modal-overlay"> <div class="modal-content">This is a full-page modal!</div> </div> </body> </html>
Log in or sign up to run or submit your code.Log inSign up
Expected Output
Clicking the button opens a modal that occupies the entire screen with an overlay.