www.wysiwygwebbuilder.com

I am using a layout grid with 4 columns containing images. Image 1 and 2 are the same width. Image 3 and 4 are 1/2 the width of image 1 or 2, so the column layout is

4x 4x 2x 2x (1 row)

At the Layout Grid breakpoint I would like the following stack to happen so I end up with 3 rows:

4x
4x
2x 2x

Is this possible in Layout Grid?

You can use the 'overflow' option to do this.

Related tutorial:
http://wysiwygwebbuilder.com/layoutgrid_advanced.html

Set overflow to 'custom'.

In the breakpoint, under columns click 'remove' to make only 2 columns and set both to 6x. Click on 'settings' under overflow and set columns 3 and 4 to 6x.

This makes sense. Thank you for responding.

I have tried this and it works exactly as I hoped at the breakpoint, but now the default view is also wrapping into 2 rows. I must be missing something. I have tried many things to correct this. Do I need to adjust the value in the Layout Grid > Miscellaneous > Breakpoint? What should that be if the project breakpoint is 480?

The grid in default shows the 4 columns in the manager and then shows the two 6x in the breakpoint manager. Everything in the grid manager looks the way it is supposed to.

Thank you for your help.

Correction: It seems to be working fine in default, but is breaking into 2 rows way before the 480 breakpoint. It must be something in the grid manager breakpoint setting I am missing.

how many breakpoints do you have? Are you using 'use min-width' for breakpoints?

if you are only using 2 breakpoints and 'min-width' then the grid is going to switch way before it reaches the 480 BP. It will switch the second the width is below your default width. You will need to add another BP below the 480 breakpoint so it switches at 480.

Yes thank you. It was the min-width setting. I really appreciate your help. It is working perfectly now.

Here is a link to the demo page utilizing the grid and the stacking you both helped me figure out. I cannot thank you enough for taking the time to assist me in getting it resolved.

http://www.peacefulnesttulum.com

It looks great!