Eliminating space around embedded element to website

Question

Here's the code I've had most success with thus far:

<div style="position:relative;height:0;padding-bottom:100%;overflow:hidden;">
  <iframe 
    style="position:absolute;top:-80;left:50;width:80%;height:100%;" 
    src="https://makecode.microbit.org/---run?id=_ft63taWvMiVK"
    allowfullscreen="allowfullscreen" 
    sandbox="allow-popups allow-forms allow-scripts allow-same-origin" 
    frameborder="0">
  </iframe>
</div>

Here's a screenshot of what it looks like in the Weebly editor. You can see the amount of space left at the bottom.

[]

I'm at a loss for a next step. Any suggestions are welcome. Thanks!

I changed various values for dimensions in the div and iframe. The values I've used thus far seem to be most successful.