I have an iframe that I would like to align perfectly within the container on my website. Right now, there is still a border when I inspect the container containing the iframe element:

The iframe is embedded as following:

<style>
iframe {
  width: 100%;
  min-height: 500px;
}
</style>
<iframe id="myIframe" frameborder="0" height="100%" width="100%"src="path_to_my_file"></iframe>

I would also like for the height of the iframe to automatically be adjusted to the height of the container. That would mean that it would need to be adjusted every time the window size changes, so I would probably need a javascript method. Is there an efficient way to achieve that?