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

Today, I will talk to you about how the div inside the web development can support the div outside to make it highly adaptive. Many people may not know much about it. In order to make you understand better, the editor summarized the following content for you. I hope you can get something according to this article.

With the launch of Microsoft's new operating system, fewer and fewer people use ie6 now, but XP seems to be too classic, there are still a considerable number of users, and most of these people are not in the habit of upgrading browsers alone, so ie6 is still the most popular browser version. According to the statistics of the traffic of this site, the proportion of visits from ie6 is 72.6%. This shows the above point, although at its peak, ie6 accounted for more than 90%.

Back to the point, div+css as the layout of the web page has been a general trend. Its advantage is not long-winded here. Recently, however, some friends have often mentioned the issue of highly adaptive compatibility of containers. Give a simple answer here.

1. In general, it can be solved by using min-height. However, ie6, the preferred browser for most netizens, does not support min-height. Ie7,opera, Firefox is fine. So compatibility can be solved by writing as follows:

The code is as follows:

Height:auto!important

Height:200px

Min-height:200px

two。 Many friends report that after using the above method, sometimes it is still unable to solve the problem that the container can not be opened adaptively. That must be the case where the container is nested, and the child container is floating. For example

Content 1

Among them, the div with class fuqin has a floating li, and when there are more li, even if the div sets the minimum height, it cannot be stretched out.

The reason is that the li, as a child container, is floating. In this case, even if the content of li exceeds the height of div, div cannot support it.

The solution is as follows:

After the floating container, add a div before the parent container ends

The code is as follows:

Content 1

.clearfloat {clear:both;height:0;font-size: 1pxposition linepower height: 0px;}

After reading the above, do you have any further understanding of how the inner div in web development can support the external div to make it highly adaptive? If you want to know more knowledge or related content, please follow the industry information channel, thank you for your support.

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.