How to make popups responsive with the new system

[timlcooley]

I am having an issue with my popups, reusable and regular where they are not being responsive.

They all work when I do responsive in the editor, when they go live and I test it on my phone (Pixel 6 pro) it doesn’t work.

[Eugene_West]

which is browser on pixel 6?
Can i check fast your editor?

[bestbubbledev]

Can you share the link of your app so I can check on my phone?

[rohanjainneri]

It’s very simple!

Make the pop up a column or row container and then put width as fixed and 100% - it will automatically fill the screen.

Or you can make it 80% width and height so it will be a proper popup on all devices!

[timlcooley]

Pitch Us | Largest platform for Investor Pitch Deck Help just click on log in

[timlcooley]

That didn’t work.

[bestbubbledev]

I’m 100% convinced that input elements have min. width defined that’s larger than the phone screen width.

Take a look at other elements too & fix their min. widths. If you share the editor link I can tell you exactly what to change

[timlcooley]

Bubble Editor - Pitchus

Does this work?

[bradey]

My solution here to solve this:

Resuable Popup not fitting to content width

I had the same issue and found a great way to handle this! After so much time trying different methods, the solution was actually simple to implement. Ensure the first level under your Popup is a Group (preferably set to Column). You will set this group’s min. width, height, fit to content, background color, etc. as needed. [image] Next, go to the popup and set the Background style and Shadow style to “None”. [image] [image] That’s it!