Community X.

Connect with other creators, share ideas, give feedback and get the latest product updates.

Jan 28

Is there an easy way to set up "max width" on the entire site?

I built my site to be responsive where the elements are docked based on the percentage of the screen. (15% from the left, 15% from the right). However, this proves an issue on huge monitors where all the elements become SUPER elongated.


I know you can add max width to each section, but is there an easy way to apply max width across the whole site and pages all at once?

2 answers3 replies
1
Jan 28

You can set padding for each page.

1
Jan 28

There is no easy way to do it.

Basically you need to add a container inside every section and set max-width to it.

All the content for this section needs to be inside this container.

Jan 28

If you select in the Layers panel the page itself and then open the Inspector panel, you can set the padding for the whole page in px, %, vw and wh. It also possible to apply at once to more pages.


I have learned to be a very stable feature. I also tried vertical sections, but these are causing issues for my website down the line.



Jan 28

This solution I quick and good. But if you want to let's say add background color to section or background image, you will have a white gap because the page padding.

But if you add a container for content and set max-width you can still use the full page with.

@Matanya Thanks for the response! I'm only concerned about desktop monitors though and not what users are seeing currently on other devices. I think I can just create another breakpoint for larger screens as the easiest option. Containers would be another option but I have grids and that would take a verryyyy long time haha.

Editor X

Design your boldest creations.