Modal content max width

Hi,

My website has a max width of 1200px. I am wondering how I can get my “Service” modal to line up with the website’s content when it is open. Currently, when you click the Service button at the bottom of the page, everything aligns to the far left. On a larger resolution this looks odd.

I’d like the modal to take up the entire screen (black semi transparent background) while the content has a width of 1200px (like the landing page).

Current views:

Thanks for the advice,
Philipp


Here is my site Read-Only: https://preview.webflow.com/preview/philphilphil?utm_medium=preview_link&utm_source=designer&utm_content=philphilphil&preview=6c349b74a06ff1dfc0389dccac51c8c1&mode=preview

Hi, following up and wondering if anyone has some advice to go about this?

Place a div in the modal, give it max-width 1200 and center it by setting its left and right margin to auto. Now place all of the content of the modal in that div.

In short, do inside of the modal what you did for your page layout.

@vincent thank you very much! I forgot to implement the auto on both sides. It’s working perfectly now!

1 Like