Responsive HTML widget

Tips & Tricks
1

I am trying to create a responsive grouping of n HTML layout and a rectangle that covers the entire screen. I have tried different combinations of the flexibly layout, playing with things like Stretch, Expand to Fit, Shrink to Fit etc.

Either the HTML Widget is too far off the left side or there is a gap between the Widget and the rectangle.

image
image2522×1238 1020 KB

Scaling - HTML Widget and Rectangle.hype.zip (37.4 KB)

Can someone suggest what combination of settings would allow the two elements to scale across different resolutions with no gaps nor cut-offs?

I am attaching the file here.

Thanks in advance!

2

image

without "zoom contents" you'll fight against some responsive settings that the embedded site contains ...

1 Like
3

Thank you Hans!!!

It was quite tricky, but evenutally I got it to work. Here are screenshots for the 3 elements for others trying to solve the same issue:

Screen Shot 2020-10-15 at 4.38.57 PM
Screen Shot 2020-10-15 at 4.38.57 PM2308×376 44.8 KB
Screen Shot 2020-10-15 at 4.39.05 PM
Screen Shot 2020-10-15 at 4.39.05 PM2286×364 43.1 KB
Screen Shot 2020-10-15 at 4.39.15 PM
Screen Shot 2020-10-15 at 4.39.15 PM2276×426 63.6 KB

1 Like