I am trying to create a properly aligned dynamic inline macro in a Confluence Cloud app. Does this work at all at the moment? Is there a working example?
Since dynamic resizing sets the wrong width (as reported here, I have set data-options="resize:false" and am calling this code after rendering the macro:
const acContent = document.querySelector('.ac-content');
AP.resize(acContent.offsetWidth, acContent.offsetHeight);
I have set the styles font-size: 16px; line-height: 1.714 to match the font style of a regular Confluence page.
The problem is that the iframe is misaligned:
These are the dimensions of the iframe:
The problem is that no matter how high I make the iframe, it is always aligned above the baseline of the text. I can use line-height: 1 in combination with overflow: hidden to align it with the rest of the text, but then tall letters like j are cut off at the bottom (which makes j look like an i).
I cannot even imagine any use case for inline macros where this misalignment wouldn’t be a problem. Is there some trick to align the iframe? Or are inline macros simply something that is not properly supported in Confluence?