Solution to interface deformation when setting frameset height
Currently I have made a project, the interface is as follows: This was done using frameset. No problems were found when developing on a wide screen until a user tested it on a 800*600 machine and found that the entire interface was deformed. At that time, the entire frameset page was only 600 pixels high, and scroll bars appeared in the frames nested in the frameset, which was really ugly. How can I set the height of the frameset higher so that the nested frame page has no scroll bar but the frameset has a scroll bar? The height of the frameset cannot be set, for example: <frameset rows="110,*" style="height: 1900px;">. At this time, the page is still the height of the screen, not 1900px; setting the height of the frameset's body is also invalid. What should I do? I searched Baidu for many days but couldn't find the answer, so this question has been left unanswered. I also thought of asking the artist to replace the frameset with DIV+CSS, but I was afraid that it would involve too much content and the workload might be too great, so I had to give up. Inspiration is a strange thing. It may come or not, but when it comes, you cannot stop it. Just after this problem was left for about a month, it suddenly appeared today, and it came with an iframe. When I nested the frameset in it and set the height of the iframse page, the effect really came out. I would like to share the solution with colleagues who have encountered the same problem but cannot solve it. 1. frameset page (inner.html) Copy code The code is as follows:<html> <frameset rows="110,*" frameborder="no" border="0" framespacing="-4px"> <frame src="header.jsp" name="topFrame" scrolling="no" noresize="noresize" /> <frameset cols="170,12,*" framespacing="0" frameborder="no" border="0" id="mainFrameset"> <frame src="left.jsp" name="leftFrame"scrolling="auto" noresize="noresize" id="leftFrame"/> <frame src="narrow.jsp" scrolling="no" noresize="noresize"/> <frame src="" name="mainFrame" noresize="noresize" /> </frameset> </frameset> <noframes> </noframes> </html> 2. iframe page (outer.html) The key is to set the height of this page. You can set it as high as you want. At this time, the frameset contained in it will also be this height. Copy code The code is as follows:<body style="margin: 0px;height: 580px;width:960px;"> <iframe src="inner.html" style="height:100%;width:100%;border-width: 0px;"> </iframe> </body> |
<<: How to prevent duplicate submission in jquery project
Recommend
How to build a DHCP server in Linux
Table of contents 1. Basic knowledge: 2. DHCP ser...
Summary of common functions of PostgreSQL regular expressions
Summary of common functions of PostgreSQL regular...
IIS and APACHE implement HTTP redirection to HTTPS
IIS7 Download the HTTP Rewrite module from Micros...
How to deploy Node.js with Docker
Preface Node will be used as the middle layer in ...
Resolving MySQL implicit conversion issues
1. Problem Description root@mysqldb 22:12: [xucl]...
4 Practical Tips for Web Page Design
Related articles: 9 practical tips for creating we...
Docker enables seamless calling of shell commands between container and host
As shown below: nsenter -t 1 -m -u -n -i sh -c &q...
Use PS to create an xhtml+css website homepage in two minutes
There are too many articles about xhtml+css websi...
HTML Grammar Encyclopedia_HTML Language Grammar Encyclopedia (Must Read)
Volume Label, Property Name, Description 002 <...
JS implements sliding up and down on the mobile terminal one screen at a time
This article shares with you the specific code of...
Analysis of the principles of Mysql dirty page flush and shrinking table space
mysql dirty pages Due to the WAL mechanism, when ...
Summary of the Differences between find() and filter() Methods in JavaScript
Table of contents Preface JavaScript find() Metho...
Install mysql5.7 on Ubuntu 18.04
Ubuntu 18.04 installs mysql 5.7 for your referenc...
How to implement scheduled backup of CentOS MySQL database
The following script is used for scheduled backup...
How to implement mask layer in HTML How to use mask layer in HTML
Using mask layers in web pages can prevent repeat...