Using the Nova template I am unable to change the width of new containers within the default Banner Grid.
See photo below: I would like to make the Valley Brass container take up half the width of the page and have the Twilight Concert Series container take up the other half.
Please help!
The Id is : 2072311
Thank you for the prompt response. I am unable to get to Design-Layout Type: Grid. The photo below shows in the Breadcrumb bar that I have selected the Banner Grid, however only the left hand side panel opens up automatically.
The right hand Design panel was manually opened and within the Layout tab there is no option for Grid.
What am I doing wrong?
Hi @Laura,
Thanks for sharing the screenshot — I can see why this is confusing. It looks like you’re currently inside a Banner Grid element, which already has a built-in layout. That’s why the Design → Layout → Grid option isn’t appearing in the right-hand panel.
To get the grid option, we’ll need to check the exact element you have selected. Could you:
Open the Navigator (stacked-layers icon at the top left).
Take a quick screenshot of that hierarchy showing the section where the banner sits.
Once we see that, I can guide you step-by-step — either to select the right parent container so the grid option appears, or (if it’s faster) to recreate the section using a standard container and apply a Grid layout to it.
Hi @Laurawheelermusic, have you come up with a solution yet?
You can try the following. I just found time today, so you can see the result if this is what you wanted!
Keep one parent container for the row.
Add two image (or content) elements inside that same container.
In the Container settings → Layout (Flexbox):
Set the main axis to a row (so elements go left-to-right).
Turn wrap off so they stay on one line.
On each image/content block, set the width to 50%.
That way, the two containers (like Valley Brass and Twilight Concert Series) will sit side by side, each taking up half the width of the row.
Bonus: For mobile view, you can let them stack by turning wrap = on so they drop underneath each other neatly.
Hi!
With both of your offered solutions I am still struggling to make it function properly. I must be missing something here. The image attached is what it looks like currently as I attempt to follow your above instructions.
I also tried to add a container underneath the Banner Grid in which I put a 2 Column Grid, but the vertical margins are insane. I’m certain I’ve done something terribly wrong there, but perhaps that’s an issue for a separate help post!
