Forum Academy Marketplace Showcase Pricing Features

How to remove overflow hidden ID?

I have a repeating group with user avatars. The group is squashed so that the avatars overlap (for styling reasons). The last avatar is cut off, so I need a way to remove the hidden part. See below:

avatar cutoff

This was discussed here but the solution which was presented doesn’t seem to work for me.

The avatar name is “avatar123”

I have HTML with the following code:

Here is the ID attribute:

Screenshot 2021-06-08 235504

Right now your app is saying force apply overflow: visible on the image… But it’s the parent you want to allow overflow. So looking at the screenshots, I’d say you should give the class avatar123 to the repeating group rather than the image.

Also, see if it can work without the !important part as it should be used only when necessary.

This doesn’t work, I tried applying the css to the parent and actually every single element within the repeating group but no joy. Would you be able to have a look at my code to see if I’m missing something obvious?

When I load the preview, there are no users to be shown so it’s hard to diagnose. Can you make it so there are at least two attendees?

I’ve made it have 4 attendees now so you can see the 4th circle is hidden.

You almost had it. You just forgot to install the plugin Classify loll!

As you can see, the id of the repeating group is still the Classify command, but it should be empty once Classify parses it.

You can see the repeating group highlighted in blue and the fourth picture overflowing from it. I manually changed the overflow property of the repeating group and it did the trick. So I believe you literally just have to install Classify to make it work.

And the use of !important shouldn’t be required.

1 Like

Oh great thank you! I have installed Classift but the overflow is still hidden?

you don’t need the period in front of the class name in the ID field

Well spotted. I removed it but still not working :frowning:

have you tried with the !important statement?

1 Like

I hadn’t, but just added that and it now works! That was a mission so thank you for helping me solve it!