I’m building an Unrestricted Custom Component that displays a long text document in a central column, with absolute-positioned margin comments on the left and right. Think of it like a “Word document” with inline highlights and margin notes.
-
The text is rendered in paragraphs in the middle column.
-
Comments are absolutely positioned (using
style={{ position: 'absolute', top: ... }}) in the left/right columns. -
Each comment lines up with the highlight in the text.
My problem:
I want an internal scrollbar within the component when it’s taller than the bounding box. I’ve given the custom component a fixed height in UI Bakery and set overflow: auto in my top-level <div> style. This works in some cases (e.g. with short sample data), but with my real data, the scroll sometimes doesn’t appear (and I don’t understand why).