Streaming live at 10am (PST)

CMS Collection isn't stacking in mobile view

Hello - I need to finish our wedding website in a couple days and I’m having a lot of trouble getting a CMS collection in the Bridal Party page to stack as a single column in mobile. When I use the full width option in CMS, it affects all of the responsive displays and is pushed to the left. I can’t seem to figure out how to only make this happen in mobile.

I’ve tried to manually create this using columns and they do stack up fine. How do I achieve the same thing with CMS collections? I would hate to remake everything individually…

Please help!

Here is my site Read-Only:
([how to share your site Read-Only link][2])

The solution is to use flex. Set a collection list to display:flex horizontal then wrap the children (list item) with a width that controls the number of items (in a visual row). You may need to use two classes to control the different lists you are displaying (one with only two, the other with more) etc.

It’s really not a big refactor.

Thank you so much!! That did it.