[Solved] modal box absolute center

[prophoto]

I have a modal box that, just like most modal boxes, should be absolutely centered. I have tried a few of the options here https://css-tricks.com/centering-percentage-widthheight-elements/ and from the comments.

Now to my issue….the modal box is triggered by a search button that could be 500px or 2000px down the page depending on screen size. All options I have found for using percentages to center it are from the top of the page, not from the portion of the page currently being viewed. Any ideas? Thanks!

.center {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}

and I have tried

.center {
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
}

[prophoto]

Just found that solution too, works like a charm. Thanks.

[Author]

Posts