I’ve created a collection list with a grid and used one of the tips on the forum about how to keep my images square by setting width to 100% along with padding. I’ve attached a screenshot that shows that it looks exactly how I want to on the builder but if you look at the link, weirdly the first column is displaying larger than the content on the other columns. Quite confused as to why it’s behaving like this, the grid specifies all columns are 1FR and again it looks fine before I hit preview.
Edit: As a matter of fact the problem is also because of the margins of your “about content” div. Remove margins and instead use paddings. The columns will be the same width after that.
I adjusted it to width - 100% as well as changing my about content to use padding instead of margins and im still getting the same problem unfortunately
Ah I see. The long email wouldn’t let our grid element to become smaller than this text. You may set overflow:hidden for your collection item. In this case your email address will be cut off though.
Hello! I’m having a similar problem. Grid is almost fully responsive in the designer, but doesn’t change at all in preview mode. When I set padding to the container it aligns to the right as well. Any idea how to fix this?