Making Card Text Confined to Grid Cell

[mefken]

I am using a Card inside a Grid element cell. I want the Back text to stay confined within the cell and the overflow to be visible on a vertical scroll.

I have found a way to do this using custom CSS, but only if I use pixels to specify the height of the back content box. But this doesn’t work responsively.

Is there a way to force the card content to stay inside the grid cell?

In my secure note, I’ve included a Dropbox link to screenshots of what I want it to look like as well as what it looks like at other screen sizes to show how even with the custom CSS, the text is still not staying inside the grid cell.

Thanks for your help!

[friech]

Hi Meredith,

Thank you for writing in, please try adding an overflow: hidden; to your cell so the card will not overflow.

CSS property Overflow

Since this has something to do with your customization and not an issue with the theme, regretfully we can not provide support for further customazation from here.

Cheers!

[mefken]

Thank you for your response. Adding overflow: hidden to the card element css did the trick!

However, please note that the problem of the text overflowing is not related to my customizations. I was using custom CSS to try to solve that problem. If you would like to see what it looks like without any custom CSS, please see the newest pic I added to the dropbox link in the private note. This overflow problem happens on not just your card element but also headlines and textboxes in general–and it happens when they are inserted as elements into rows as well as the grid cells. It would be helpful to be able to set a hidden overflow as well as a scroll option for overflow text in the Cornerstone controls themselves.

Thank you, though, for a helpful and prompt reply! I wish you all the best!

[nabeel]

Hey Meredith,

By default the overflow property is set to visible so make sure the containers height is set to auto where you’re adding your elements otherwise if the content height exceeds the parent container’s height, you’ll face such issues.

Hope this helps!