In the webpage design, the height: 100% can be used for the whole screen, but the following must be added to the webpage header:
<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML xmlns = "http://www.w3.org/1999/xhtml">
Later, we found that the height: 100% attribute was added to both HTML and body, which is the key to the highly adaptive problem.
The Code is as follows:
HTML, body {<br/> margin: 0px; <br/> Height: 100%; <br/>}
Whether the height of an object can be displayed as a percentage depends on the parent-level object of the object. The table is in the body, so its parent-level object is the body. By default, the body is not given a height attribute, so when we directly set # left to height: 100%;, it will not produce any effect, and when we set 100% for the body, the height of its sub-level object table is 100%, which is a highly adaptive problem caused by browser parsing rules. In addition to the body application, the Code also applies the same style design to HTML objects. The advantage of this is that IE and Firefox can be highly adaptive. In addition, the HTML Tag in Firefox is not 100% in height, so the two tags are defined as height: 100%, to ensure that both browsers can be properly displayed.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
