-
Hi team – I’m looking to make a page with mixed full width and contained sections. In other page builders I would set the whole page to full-width, then choose container by container if the container/block is full width or contained.
Is the best way to do this in GP making the page full-width, then manually setting widths of a contained block on desktop/tablet/mobile? Or is there a way I can use the global site content-container settings for individual blocks/containers?
-
Hi there,
our recommend method is to use a Full Width Page and build each section with Container Blocks.
But you do not need to manually set widths for different device sizes.1. set the Content Container to Full Width.
https://docs.generatepress.com/article/content-container/
2. on the page Add your Container Block
2.1 in the blocks toolbar, click the Add Inner Container Block
https://docs.generateblocks.com/article/add-inner-container/This will create the nested section like so:
Container Block #1 - Full Width ---- Container Block #2 - Has Max WidthThat method automatically sets the Sizing > Max Width of Container Block #2 to the Global Max Width setting. Which defaults to 1200px and can be set in the GenerateBlocks Settings.
As its max-width setting its auto responsive so it needs not be changed for different screen sizes
You will need to add padding to the Container Block to suit your needs.
-
Thank you – the global max-wdith works great. I wasn’t able to see the inner-container shortcut until I created a new container (even though it wasn’t inside another container).
From the article:
Note that this shortcut won’t appear if the Container is already inside another block. In those instances, you can manually add one as you would any other block.
-
I wasn’t able to see the inner-container shortcut until I created a new container (even though it wasn’t inside another container).
Hmmm… could be a legacy container issue.
All working ok now though ?
-
All good thank you
-
Glad to hear that!
- You must be logged in to reply to this topic.