
I was getting a vertical scoll bar in some embed situations. ChatGPT suggested this mildly tweaked code that fixed the issue. I’d love to have this code be the default embed option.
<div style="position: relative; width: 100%; padding-bottom: min(60.97%, 95vh); height: 0; overflow: hidden;">
<iframe
src="VIDEO.URL"
style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0;"
allow="autoplay; fullscreen"
allowfullscreen
mozallowfullscreen
webkitallowfullscreen
playsinline>
</iframe>
</div>
It differs from the current embed code in the following ways, per ChatGPT:
Consistent use of top: 0; left: 0; to pin it inside the parent container.
Removed conflicting inset: 0px and replaced it with top/left for clarity.
No scrollbars because the height of the parent is defined by padding-bottom and the <iframe> is absolutely positioned within it.

Hi Jeff, can you share the link where the video is embedded for us to take a look? Thanks

After some testing apparently the default embed code works in several situations, just not in the one I needed at the time. So…nevermind. I’ll just use the tweaked code for my specific situation.