¿Cómo reducir el espacio en blanco no deseado en la página web?

Tengo una página que contiene dos divisiones verticales. El primer div contiene el titular del iframe y el segundo contenido aleatorio. El iframe puede tener menos o más altura (tiene altura dinámica).

El problema cuando el titular del iframe disminuye en altura, lo que provoca un espacio en blanco no deseado entre el titular del iframe y el segundo div debajo de él. Este problema ocurre solo en Chrome , IE y FF funcionan bien.

¿Cómo puedo hacer que este espacio en blanco se reduzca cuando el iframe disminuya en altura?

Aquí está mi página

El div del titular del iframe contiene las tabs del menú, el segundo div debajo contiene 3 columnas de contenido.


Actualización # 1:

Captura de pantalla uno:

enter image description here

Captura de pantalla dos:

enter image description here

El problema es que su recibe una height línea de 311px;

Mi suposición sería que está obteniendo la altura de la pestaña más grande y aplicándola a todas con esta js:

 function resizeIframe(obj) { obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px'; } 

y o

 onload='javascript:resizeIframe(this);' 

Si agrega jQuery a dual_core.html, la siguiente secuencia de comandos debería ayudar. Puedes hacer el equivalente sin jQuery, pero hice algo similar, así que acabo de reemplazarlo con tus ID de selector.

 $('#dualcore_servers_menu_wrapper1 a').click(function(){ menuHeight = $('#dualcore_servers_menu_wrapper1').height(); contentHeight = $('#dualcore_servers_content_wrapper1').height(); $('iframe[name="dservers"]').height( (menuHeight + contentHeight) + 'px'); }); 

No es exacto, el selector $ (‘iframe [name = “dservers”]’) deberá cambiar, pero es la idea general. ¡Espero que esto ayude!