Skip to main content

Hello everyone! I have embedded a Miro board into my web app and have a button that modifies the iframe’s dimensions in order to show/hide the board. IF the Miro board is visible on page load, then resizing does not impact the board and it works perfectly. However, if the Miro board is off screen on page load, it shows up on resize with all text elements vertically shifted down one line as seen in the screen shot below. I tried to investigate the way that text elements are rendered on the Miro canvas but it’s quite a complex code and I got lost in the inspector. Any idea what may cause this issue? Thanks in advance for your time!

When editing the text, it is properly aligned:

 

When viewed on the canvas (selected to show intended location):

 

@Gal Ben-Chanoch - This could be a bug, albeit an edge case.

Have you been able to reproduce this outside of the board being embedded, e.g., by sizing the board to match a smaller, embedded size?

I suspect that one of the Miro product teams would be interested in seeing this, especially if you were able to make an example public for them to view. Have you submitted a support ticket?

Hi @Robert Johnson,

Thank you for the reply. I am actually not resizing the embedded iframe itself. The iframe is set to width: 100% and height: 100%, and the container that is containing the iframe is being resized. I should have been clearer but it was a long day of debugging haha.

 

I’m not sure how I could test this in a nonembedded scenario.

Hi Robert, thank you for the reply. I am actually not resizing the embedded iframe itself. The iframe is set to width: 100% and height: 100%, and the container that is containing the iframe is being resized. I should have been clearer but it was a long day of debugging haha.

I’m not sure how I could test this in a nonembedded scenario.

Wow, I’m not sure how to test that either. :rolling_eyes:

Reply


Terms & Conditions