Columns Don't Change At Break Point

[guybower1]

hi

I have a section on my homepage which has a row and 2 columns in it and I have it set to 2 columns at the largest break point, but then goes to 1 column for all subsequent break points. The only thing is, it doesn’t go to 1 column at all. It just squeezes the columns making the text column long and thin

The section is called What People Are Saying and it is Row 2

Any ideas on why this is not breaking to 1 column where instructed?

Details in the secure note

Thanks in advance

[friech]

Hi @guybower1,

Thank you for writing in! you set a 40% max-width to your columns, this 40% max-width on this context will always 40% (of the container) and will never break (overlap) the 2 columns. Whereas if you set these to 400px the moment before the columns become lower 400px it will wrap the 2 columns to maintain that 400px.

The one column on the Layout settings is a flex-basis set to 100%, that 100% force the columns to wrap since it’s taking an entire 100% width, your 40% max-width is preventing that to happen.

A Complete Guide to Flexbox | CSS-Tricks

Cheers!

[guybower1]

Thanks so much Friech

I have made the adjustment and read the guide

Thanks again

[friech]

We are delighted to assist you with this.

Cheers!