Maximum Page Width

[Bucky108]

Is it possible to have a responsive page with a maximum width specified, other than using a Flex Grid??

[crispy68]

You can set a maximum width in a layout grid or flex container. In a floating layer with the alignment set to center will keep objects within the page boundaries you set.

[Bucky108]

OK but there's no direct way to do it right?

It would be a nice option to have in Page properties.

[crispy68]

So here is how you have to think about it.

In page properties, you set the page width. This width is indicated in the workspace between 0 and the blue dotted line on the right. This is where you should place your objects. If you simply place objects onto the workspace and use breakpoints (and don't use any floating layouts which includes grids, flex container, flex grid, etc) then you are creating a fixed, adaptive website. In each breakpoint, you simply adjust the layout by moving the objects and keeping them within the page width you set in page properties. If you set the page alignment in the page properties to center then all your objects will center in the browser. In this case all objects are within the page width you set. You will see blank space on the left and right depending on the browser size.

However, if you are wanting to create floating layouts (ie: responsive, flexible, fluid, etc) then you will be using grids, flex containers, flex grid and floating layers. You will need to set the page alignment to 'do not center'. Flexible design always fills the entire browser. That's the whole point of it. However in floating design, the page width does not keep objects within the page width you set. The grids, flex container and Flexgrid control the layout. So in floating design, you will need to specify a max-width for your layout which is done by specifying this in the layout grid, flex container and flex grid.

[Bucky108]

Got it..thank you.