Dynamic Position/Height for Repeating Group Elements

Hi everyone,

I’m working on building a custom calendar-style view where events need to be positioned dynamically on the page. I’m using the Classify plugin for this. (I have tried the available calendar plugins, and they don’t work for my use case)

Here’s my setup:

  • Clicking a button creates an event in my database. Each event entry displays as a Bubble element in a repeating group.
  • Inside the element’s ID field, I’m writing CSS logic through Classify that positions and sizes the event based on its start time and duration.

When it works, the positioning is exactly what I want.

The issue:

  • The events only render sometimes.
  • For example, on page load or when new events are created, only some of them appear. Other times they don’t show up at all. And sometimes they show up as a tiny line at the proper start time, but not with the proper height.
  • And sometimes it all works perfectly for a while, only to suddenly fail.

If I do a full page reload, sometimes all the events render correctly again. But only sometimes…

So the code/logic itself seems fine, but it looks like Bubble isn’t always applying it at the right time.

Has anyone run into this before with Classify (or dynamic CSS in ID fields generally)? Any tips on how to make sure the CSS applies reliably inside a repeating group?

Thanks in advance!