how to get just the visible content when overflow is set to hidden?

[sris24x7]

I am using a div around an iframe and I set the overflow to hidden in the css for div The content is clipped.

I am wondering, is there any way to the get just the visible content?

Here is the code:

<div class="problemBox">
      <iframe id="problem" src="child.html"></iframe>
  </div>

<style>
  .problemBox {
    width: 300px;
    height: 300px;
    overflow: hidden;
  }
  .problemBox iframe {
    width: 100%;
    height: 100%;
  }
</style>