Why does the popup close all at once?

Question

css

Here on this site I made a window, everything is in the source tab - the site
I made a code so that the popup closes on a click outside the popup -

modalOverlay.onclick = function(event) {
    if (event.target != modal) {
        modalOverlay.classList.toggle('active')
    }
}

Only now it closes by clicking on everything, except for the div with the modal class, and everything inside the div closes the popup, although it shouldn't be the same. How to be?

Answer 1

Vanga toaster mode on: probably you mean the indentation set on the body tag? You need to reset its margin

body {
    margin: 0;
}

Answer 2

It seems that I solved the problem by rewriting the code

modalOverlay.onclick = function(event) {
    if (event.target.contains(modal)) {
        modalOverlay.classList.toggle('active')
    }
}

Only now there is a way to get to the div with the .modal class, the popup closes, which is not necessary