Why No "Responsive Width and Height" Option for Embedded HTML Widget?

[leisureaddicts]

One thing that has been a big issue for me in achieving a truly fluid-responsive site in Adobe Muse is that the Embedded HTML widget only has resize options for "Responsive Width" and "Stretch to Browser Width".  Unlike images or many responsive third-party widgets, there is no option for "Responsive Width and Height".

Yet, there are cases where such an option would be useful.

For example, if one is using a responsively styled iframe (using code suggested by embedresponsively.com, as I'm doing -- exact code is shown below), the iframe content itself will scale inside of the "Embedded HTML" Muse container in a proportional width & height type of way.  However, since the Embedded HTML widget does not respond by scaling its own height (as the only closest available setting is "Stretch to Browser Width"), as the browser width decreases, there is a visual gap between the Embedded HTML content and the next element down the page (in my case, a text box) which grows larger until the next breakpoint is reached.

My embedded thing is as follows (this is an iframe containing a Matterport 3D scan):

<style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style><div class='embed-container'><iframe src=https://my.matterport.com/show/?m=VUdqKQt7NEu&brand=0&hl=0 frameborder=0 allowfullscreen></iframe></div>

And you can see the behavior I'm talking about by visiting;

http://www.evillapalmsprings.com

If you start at a wide browser width and than decrease the browser width, you will see the Matterport content shrink responsively within each breakpoint and note that the gap between the content and the text below visually increases until the next (narrower) breakpoint is hit.  Once a smaller breakpoint is hit, the Matterport content will redraw and, at that specific width, the boundaries of the embedded iframe and following text frame are exactly where I want them.

But until you reach the next narrowest breakpoint, there's a gap that at times becomes rather ugly. (This is because, again, the HEIGHT of the Embedded HTML widget does not scale itself.)

Would be better if there were a "Responsive Width and Height" option for the Embedded HTML widget. (And I'm baffled as to why this wouldn't be an option.)

Thanks for any ideas, alternatives or for taking this as a Request for Enhancement, Adobe friends!

Best Regards,

Keith

[Preran]

Hi,

Thank you for your feedback. I will share it with the product team for their observations.

Thanks,

Preran

[Danielle Beaumont · Accepted solution]

Keith --

Although I could not share precisely how it is implemented I have seen examples of a responsive height and width widget in the Muse Widget Directory. This one from QooQee.com is a good example: Responsive Height.

Are you looking to sell something comparable, or just purchase one for your own design needs? How well does the QooQee instance meet your needs?