I use the following code to achieve dynamic iframe height:

In the <head>:
Code:
<script src="jquery-1.10.2.min.js"></script>
<script language="javascript" type="text/javascript">
  function resizeIframe(obj) {
    obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
	var iframeDoc = $('iframe[name="dservers"]').contents().get(0);
$('iframe[name="dservers"]').load(function(){
    docHeight = $(iframeDoc).height();
    $('iframe[name="dservers"]').height( docHeight );
});
  }
</script>
In the <body>
Code:
<iframe name="dservers" src="dual_core.html" width="100%" frameborder="0" scrolling="no" onload='javascript:resizeIframe(this);' /></iframe>
This code works fine and it dynamically adjust the height.
The Problem here is the Firefox. It do adjust the height of the iframe dynamically but when the content height in the iframe decrease, the iframe doesn't decrease with it. So it is auto adjusting the height if it is getting taller only and not shrinks if the height decreased, causing big unwanted white space. Chrome and IE are working fine at the moment.

Here is my page. Please take a look on it and let me know if anyone has any solution for this problem. Any help would be appreciated, Thank you guys!

Some Screenshots:

ps_blur1_chrome.jpgps_blur2_chrome.jpg