Responsiveness on pop up function

[Thomas_92 (Thomas)]

Hi,

I am having an issue with my website and its responsiveness on smaller mobile devices with a particular pop up function…

In the line up section, artists are clickable which triggers the pop up window animation for the various artists. I am having an issue with this pop up window on mobiles. If the mobile is a older model the artist wrapper block completely fills the screen and hides the close function. I am sure its a relatively easy fix, but I can’t get the result with padding changes etc.

You can view my site here and can see the issue when the pop up is open and you make your browser window to that of a smaller mobile device size. http://so-what-music-festival-bc-f9de37104836d.webflow.io/

Any help would be greatly appreciated.

Thanks again,

Tom

---

Here is my public share link: https://preview.webflow.com/preview/so-what-music-festival-bc-f9de37104836d?preview=bc955d9068440c093a69db1c25fca54e

[Waldo (Waldo Broodrÿk)]

Hi @Thomas_92 great question!

I would recommend adjusting your Flex Layout styles for mobile landscape and down to the following:

Flex-layout: Align-start
Max-height of 100vh (100% of viewport height)
Overflow: scroll

Here’s a screenshot showing those styles:

You may want to adjust the padding as well. Hope that this is helpful

[Thomas_92 (Thomas)]

Hi @Waldo,

Big thanks for the quick help. Your solution has resolved my issue perfectly!

Thanks again,

Tom