Streaming live at 10am (PST)

Modal responsive help required


#1

Hi,

I have just completed doing my first modal following a webflow guide and it all went very well, however, the transition from full screen to say a mobile looks quite messy. I really want to make it a smooth transition. My current modal in responsive looks like the following video

Does anyone know how to make the widths/lengths stay in a fixed position until they really NEED to move..? If you get what im saying?

I want to keep the modal fairly small on desktop also... Any ideas?

https://vid.me/7VpZ

read only: https://preview.webflow.com/preview/inkfndry?preview=26bcfd6d07cd5a400b5b3f8d2e097811


Here is my public share link: LINK
(how to access public share link)


#2

That is generally how responsive websites work. Keep in mind almost no one is going to actually drag the width of the browser like that so how it shifts doesn't really matter. Generally, the browser will load one width where the modal will be static. The only way I can think of to make it not shift like that is to set a max width in pixels for the modal and make it like 90-95% width. That way it will stay the same size (max) on desktop until you reach that value with the width of the browser in which case the modal will get squeezed and increase height. Flexbox can also tackle things like this in cool ways.


#3

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.