Grid of Multiple Columns With Multiple Sizes In One Row

[alexwright]

Hi-

Trying to set up a single row of six columns, with the columns set to these widths :

LG : 2 (all six columns display on one row on large)

MD + SM : 4 (two rows of three columns wide on medium and small)

XS : 6 (three rows of two columns wide on extra small)

For Bootstrap, this would be pretty straightforward. Swift Page Builder is set up to establish the width of each column on Small then go from there. Doing so using the Swift Page Builder, the Small setup dictates (in the HTML) two rows of three columns even if these columns aren’t in actual separated rows (in Swift Page Builder). The grid of columns can never break out of this for large (one row of six columns) or extra small (three rows of two columns).

Is this just not possible with Swift Page Builder? All the columns are the same height.

Screenshots attached.

Thanks,

-Alex

Attachments:

You must be logged in to view attached files.

[Rui Guerreiro – SUPPORT]

Hi,

You can try to use the columns custom sizing.
https://www.dropbox.com/s/770crxt24gmpooi/Screenshot%202017-02-28%2015.52.47.png?dl=0

-Rui

[alexwright]

That’s what I’ve done. Did you not get that screenshot? Attached again. It doesn’t work as the code wraps whatever columns are next to each other in the Small setup into artificial rows even though they are all in one row in the Swift Page Builder. Screenshot attached of the output HTML.

Any solution to this? I can’t imagine I’m the only one that wants to put multiple columns in one row with multiple sizes for display as different grid setups on different screen sizes.

Thanks!

-Alex

Attachments:

You must be logged in to view attached files.

[Rui Guerreiro – SUPPORT]

Apologize, didn’t realized you were already using that option.
Will have to forward this one to our head developer.

-Rui

[alexwright]

Thanks! I’ll be interested to hear more about this. The staging server shows the issue as described in this ticket, and you should have login credentials with Editor permissions.

Best,

-Alex

[Swift Ideas – Ed]

Hi @alexwright

Unfortunately this use case isn’t currently possible, as it can’t change the source based on the setup in the page builder. The idea for this is to change the columns size on mobile/tablet.

We’ll consider options for this in the future.

Thanks

– Ed

[alexwright]

Okay, thanks for this. Feel free to mark this ticket as resolved.

Best,

-Alex

[Rui Guerreiro – SUPPORT]

ok. marked as resolved.

-Rui