Modal Centering

Hi guys,

I built a “subscribe” modal on my page (triggered by “stay updated” in the top nav).

I’d like it to always be dead center (horizontal / vertical) on any display / device instead of having it be stuck to the top or having to use a top margin. I tried using a flex box but can’t get it to work.

https://preview.webflow.com/preview/simplified-for-men?preview=15ec73adb4b5a46f4c49c7ddb33a3ae0

Any suggestions?

Thank you!

Ed


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

Select the modal and do this:

http://vincent.polenordstudio.fr/snap/ht25t.jpg

and this

http://vincent.polenordstudio.fr/snap/nzc9s.jpg

That’s the best CSS vertical centering method untill Flexbox is universally supported.

http://vincent.polenordstudio.fr/snap/69ekq.jpg

With flexbox, select the Modal Wrapper and set it up like this:

http://vincent.polenordstudio.fr/snap/8irkw.jpg

But it will bug on most versions of IE and everything under EDGE 14

Thank you so much!! It worked perfectly on desktop but on mobile it still at the top, despite working fine in the mobile preview within webflow.

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