Shulou(Shulou.com)06/03 Report--

This article mainly introduces "the usage of min-height in DIV+CSS". In daily operation, I believe many people have doubts about the usage of min-height in DIV+CSS. The editor consulted all kinds of materials and sorted out simple and easy-to-use operation methods. I hope it will be helpful for you to answer the doubts about the usage of min-height in DIV+CSS! Next, please follow the editor to study!

Minimum height setting in DIV+CSS min-height setting

The minimum height can be set to a minimum height of a BOX, and when its content is less, it can also keep the height of the BOX at a fixed height, and when it exceeds it, it automatically extends downwards, but so far, only Opera and Mozilla are supported, and versions above IE7 support it. How to use the minimum height reasonably and wisely on the existing basis (IE680-90%)?

Suppose there are two BOX (box1 and box2), and we both set the minimum height to 150PX.

The following is a reference to the CSS fragment:

Div.box1,div.box2 {width:300px; min-height:150px;background:#EEE;float:left; margin-right:20px;}

The following is a reference to the HTML source code snippet:

Do not keep the minimum height in IE6 for 150px all IE supports keeping the minimum height to 150px

Currently, IE6 and some IE7 versions do not maintain the minimum height of 150px.

The solution

Provide csshack to set IE6 height

The following is a reference to the CSS fragment:

Div.box1,div.box2 {width:300px;min-height:150px;background:#EEE; float:left;margin-right:20px;} div.box2 {* heightvirtual autoweight; * height:150px;min-height:150px;}

The above is explained by setting box2 as follows:

* height autocompatibility importantposition height 150px; to distinguish between IE6,IE7 and other browsers to achieve the minimum height of compatibility-you may need to know the difference between CSShack and how different browsers write it.

At this point, the study of "the use of min-height in DIV+CSS" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.