We want to include this map on our Webflow site; which has not yet been published to its URL since it is still in development and will replace an existing site.
IFRAMEs haven’t changed much since the asteroids wiped out the dinosaurs- except in the area of content security. Browsers more strictly isolate IFRAMEd content so that it cannot affect the containing site, and vice-versa. Scripts and CSS cannot cross the IFRAME boundary unless the IFRAME origin matches the containing page’s origin.
In the case of more complex UX’s, 3rd party service providers like booking system providers usually accomplish this by using a javascript embed that modifies your page content, creates popups, etc, and then IFRAME just the parts they want to isolate.
Kumu appears to simply iFRAME the whole thing.
Overall that’s not a problem because your content fits and responds well.
However Kumu’s popup bar needs some vertical height to look good and be effective. You’ll want to size your IFRAME accordingly, so that this works OK for you at different breakpoints.
I’m getting conflicting behaviors on mobile; sometimes the popup is to the left, sometimes it’s below the content, so check that especially.
Your best approach is probably to set a class on the HTML Embed, and size it according to what you want at each breakpoint. Then for your IFRAME code inside the embed, set the width and height to 100% to fill that container. That gives you some degree of responsive control over the space the IFRAME will occupy.
