Have thumbs from CMS blog post collection display in 3 column rows, instead of current 4 column rows

Hello!

In the CMS block near the bottom of the page “2018 Flotilla Winners”

(the title of the block itself is 2015 Winners, and it pulls from the “blog posts” CMS collection),

there had been 8 thumbnail images in total on the front page, arranged to display in two 4 column rows (on desktop view), after archiving one blog post, and deleting another, I changed the layout settings to 3 column rows, but the layout isn’t changing to 3 across, just remaining 4 across, and the two below left justified with two blocks of space on the right? Again I would like two rows of 3 columns.

Obviously only being a 500 pixels wide, they won’t take up the full width, I’d just like them to be centered.

Having them 2 wide on the rest of the views/breakpoints is fine.

(I was not the original creator of this site.)

Thanks!!


Here is my site Read-Only: Webflow - North Carolina Holiday Flotilla

Hey @SomeHack

this is happening because you are using width and margin in your “dynamic-wrap” class. Just take it away and let the layout fix itself based on the number of columns you set at the collection settings. Set the inner margins using padding.

Hey @gilson

Your recommendation did have an effect, and I published those changes. But after i removed that class, it kept a class called Collection Item, and I tried removing that too, but had some odd results, so I reverted back.

When I tried to reduce the width size to a smaller percentage, the thumbs left justified, so I turned Float off, but then they all shifted to single file on the left (on desktop), when i centered them (button under Click + Drag) they were single file in the center, so I’m still not sure how to get them to follow the column settings that I’ve chosen on Elements Settings page?

I appreciate your help with this, at least in its current state it’s passable, but I was hoping to get the thumbs a bit smaller and centered three to a row with some space/padding on the left and right sides of the row (on Desktop view). And of course to follow the column parameters I set up to I could change the number of columns in the tablet and phone views.

(Also it would sure be nice if Webflow defaulted its values to percentages instead of pixels)