I am working on a long read article, and I have several embedded charts. They work nicely in desktop and mobile versions, as I manually did the layout, but when I resize my browser there is an individual scrolling in each box and the charts resize as well. Is there a way to prevent the carts from resizing and keep them in the same proportions as in the main layout? I’ve tried giving a specific height size and auto width, but it doesn’t work.
I dont know exactly what you want to achieve. This iframe inside iframe implementation looks a bit too complicated. Why not just putting in the charts as images, pngs or maybe svg…?
Will they be interactive, or why, are they implemented with the custom code widget?
They are animated, otherwise I would use an image format
I need them not be responsive I guess. Just resize proportionally when the screen size changes. Now I have all the frames with internal individual scrolling.
The charts are made with the Flourish app, which allows embedding of the charts.
I see… Ok first, I would guess, that you have checked the “use iframe” button in the codewidget. What happens if you uncheck it? Because now rm creates an iframe and flourish creates another iframe. That might not be that clean regarding the html structure.
And second: If you have access to the embedingcode of flurish you could adept the “height” of the iframetag from 400px to 240px, and this would then fit inside the RM-widget-container and nothing gets cut, so there is now scrollbar.
Thanks a lot.
Yes, the use iframe is on, when i turn it off it gets worse.
Unfortunately, flourish doesn’t provide the HTML code, just an embed code to copy and paste, so I can’t change much there. I can adjust the size though. I tried different sizes, but again when i am resizing my browser, the charts get resized. I guess it is a good function if you need them to be responsive, but I don’t :))