How does the iframe framework adapt to browsers with different resolutions_html/css_WEB-ITnose

The background management of asp.net is made of iframes, but the display between widescreen and narrowscreen is not particularly good, there is a big gap.
This is displayed normally in narrow screen, but there is an icon on the right in widescreen. Blank, looks very inconsistent

The following is the html code:

<table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0"><tr><td  colspan="4" id="top" height="81px" ><iframe height="81px" width="100%" border="0" scrolling="no" frameborder="0" src="top.aspx" name="topFrame" id="topFrame"></iframe></td></tr><tr><%--<td width="8px" background="images/main_29.gif"></td>--%><td width="195px" height="660px" valign="top" id="left"><iframe height="100%" width="100%" frameborder="0" src="Left.aspx" name="leftFrame" id="leftFrame"></iframe></td><td width="11px"  background="images/main_27.gif"><img src="/static/imghwm/default1.png"  data-src="../image/main_30.gif"  class="lazy"  alt="隐藏菜单"   onclick="return closeunit_onclick()"  id="closeunit"/></td><td valign="top" class="style1" height="680px"><iframe width="100%"    style="max-width:90%" frameborder="0" src="AdminHome.aspx" name="rightFrame" id="rightFrame" scrolling="auto"  ><!--onload="iFrameHeight()"--></iframe></td><td width="7px" background="images/main_32.gif"></td></tr><%--<tr><td colspan="4" height="67px" ><iframe  scrolling="no" height="100%" width="100%" border="0" frameborder="0" src="down.aspx" name="bottomFrame" id="bottomFrame"></iframe></td></tr>--%></table>

Reply to discussion (solution)

Dynamic calculation of width

Give the menu navigation a max-width in your class, and don’t let it exceed it; Logically speaking, if you give a fixed value to the navigation menu, it will generally not be blank. It may be your other styles. question .

I found out that the width of the ifram on the right side cannot be dynamically adjusted. I found some codes online, but it didn’t work.

<script type="text/javascript">    window.onload = function() {        var a = document.body.clientWidth - 195;  //取得iframe框架的实际宽度//        alert(a);  //弹出数值测试        //document.getElementById("rightFrame").style.width = a + "px";        document.getElementById("rightFrame").style.width = a + "px";    }</script>

<iframe scrolling="auto" name="rightFrame" src="AdminHome.aspx" frameborder="0" height="100%" onload="this.height=0;var fdh=(this.Document?this.Document.body.scrollHeight:this.contentDocument.body.offsetHeight);this.height=(fdh>556?fdh:556)" width="100%"></iframe>

The problem is solved, the code is posted, please share:
The html code is as follows, please note that the width and height should be set to auto

<table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0"><tr><td  colspan="4" id="top" height="81px" ><iframe height="81px" width="100%" border="0" scrolling="no" frameborder="0" src="top.aspx" name="topFrame" id="topFrame"></iframe></td></tr><tr><td width="195px" valign="top" id="left" style="height:auto"><iframe height="100%" width="100%" frameborder="0" src="Left.aspx" name="leftFrame" id="leftFrame"></iframe></td><td width="11px"  background="images/main_27.gif"><img src="/static/imghwm/default1.png"  data-src="../image/main_30.gif"  class="lazy"  alt="隐藏菜单"   onclick="return closeunit_onclick()"  id="closeunit"/></td><td valign="top" class="style1"    style="max-width:90%"><iframe width="100%"  style="max-width:90%" frameborder="0" src="AdminHome.aspx" name="rightFrame" id="rightFrame" scrolling="auto" ></iframe></td></tr></table>

<script type="text/javascript"> <!--    var winWidth = 0;    var winHeight = 0;    function findDimensions() //函数：获取尺寸     {        //获取窗口宽度         if (window.innerWidth)            winWidth = window.innerWidth;        else if ((document.body) && (document.body.clientWidth))            winWidth = document.body.clientWidth;        //获取窗口高度         if (window.innerHeight)            winHeight = window.innerHeight;        else if ((document.body) && (document.body.clientHeight))            winHeight = document.body.clientHeight;        //通过深入Document内部对body进行检测，获取窗口大小         if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientWidth) {            winHeight = document.documentElement.clientHeight;            winWidth = document.documentElement.clientWidth;        }        //结果输出至两个文本框 //        document.form1.availHeight.value = winHeight;        //document.form1.availWidth.value = winWidth;        document.all("rightFrame").width = winWidth - 215;        document.all("rightFrame").height = winHeight - 80;        document.all("leftFrame").height = winHeight - 80;//        alert(document.all("rightFrame").width +"-"+ winWidth);    }    findDimensions();    //调用函数，获取数值     window.onresize = findDimensions; //--> </script>