Card element troubleshooting

Hi there!

I’m making a testimonials page for my client and have found a format I like using the card element.

I’ve found using the photo for a background layer on the front side of the card with a transparent color shade works well for size. On the back of the card is a text testimonial and the name of the person. I’ve got the text and image essentially done and was also able to remove the buttons by turning the transparency down and turning the value to 0 as I read in other posts on here.

My issue comes from when I remove the button, it shifts the image in the front side of the card in a way that doesn’t look good and cuts off in a way that I don’t like. Is there are way to correct this?

The image above shows the left image with it correctly cropped on the front side, while the right image is now incorrectly cropped. I’ve attached how the cards look on the back side for reference.

I’ve basically figured out how to make the cards “taller” in height, but what’s technically the correct way to adjust the actual size of the card? I’d like to know for future reference.

Moving to a related issue but also including the Grid Element, I’m toying with using multiple cards in the grid format as shown above, but having issues with making the cards place flush left and right to take up more space on the screen. I don’t want the cards in the grid centered, but evenly spaced and wider to reach the ends of the screen within the section and I’m having a bit of trouble nailing that look. Here’s some photos for reference.

Thanks so much for your support and guidance. It’s made learning the builder so much easier.

Hi Tyler,

Thank you for writing in, is that the site you’re working on below? I can’t find the card elements that you’re referring to, it’s hard to give a recommendation when we can’t see the grid setup. Please provide us the direct page URL where we can see the cards, and provide us login credentials in a secure note so we can see your grid setup.

Regarding the Card height, you can increase its top and bottom padding.

Cheers,

@friech I’ve attached the secure note to the above post. I had the page in draft mode but have published it for your convenience and provided credentials. Thanks!

Will adding more padding correct the image cropping issue I mentioned? Any tips are helpful.

I’ve fixed the issue with the padding. It seems to have done what I need it to do.

Hi Tyler,

Glad to know that you are able to fix the issue.

Thanks

I did still need my question regarding the grid aspect answered if possible. Thanks!

Hello Tyler,

There are lots of possibilities with the grid, you must check our doc to learn more about grid and grid settings. https://theme.co/docs/grid You may check our video doc as well.

Hope it helps
Thanks

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.