How to make a popup scroll down

Design help General
1

I have a pop-up on my site, but it is quite long, and if the screen is small or viewed on mobile devices, the pop-up does not scroll to the end and it is impossible to reach the button to send a request.

This is because the pop-up position:fixed, but I cannot do otherwise, because then the pop-up is not visible where it needs to be opened((

Can anyone help me solve this problem? I have already looked for a solution, but I did not find anything clear(

Here is my site Read-Only: Webflow - Moon Karaoke

2

The solution is to give the popup frame a maximum size, and on your content portion to set overflow to scroll.

If you use custom styles you can isolate that to overflow-y so that you get only a vertical scrollbar.

You can see an example of that here- click the marketing offer popup.

https://sa5-modals.webflow.io/modals

3

Thanks for the answer!
But this light scroll bar looks pretty unpresentable on a dark site(( And also the scroll bar for some reason does not disappear, if all the information fits…

Maybe there is some other way?

So that you can scroll the pop-up itself like here: https://cloudfresh.com/en/ (if you click on any green button)

4

You can style or hide the scrollbar, and make it disappear ( auto ). That’s all controlled with CSS.

This one only shows the scrollbar when needed, and only on the text portion of the modal.

image
image1028×632 142 KB

I’ve some notes on the CSS styling; you can adapt that to any modal solution you build.

You could also put the scrollbar on the overlay rather than the modal itself, like your example, the mechanics are similar.