Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How to understand the adaptive height writing of DIV

2025-02-24 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

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

This article introduces you how to understand DIV adaptive height writing, the content is very detailed, interested friends can refer to it, I hope it can help you.

DIV+CSS design has a lot to learn, here and we focus on DIV adaptive height writing, I hope this article's introduction can make you gain something.

DIV adaptive height writing

Before writing CSS is highly adaptive in IE6 this problem we do not have to think about, directly set height:auto; or do not set it, but in fox and now IE7,8 will appear problems, here we will write a DIV highly adaptive writing,

I saw a lot on the Internet but felt it was not suitable. I saw a way to set two floats for both at the same time.

.pageRight,.pageLeft{ clear:both; }

This will appear a problem is to float left and right to clear, although in IE6 the same problem, but in other browsers will appear under the problem, let's see how I deal with it.

Let's look at CSS layout code first.

The above code is to divide pageLeft, pageRight into left and right, and also to adapt the height.

.pageRight{ width:320px; height:auto; float:right; height:600px; text-align:center; } .pageLeft{ width:650px; height:auto; float:left; height:600px; border-right:1pxsolid#cee8cd; padding-right:8px; clear:both; position:relative;overflow:auto;height:auto; }

The red sentence is important because it separates left and right and automatically adapts to the content DIV height.

About how to understand DIV adaptive height writing to share here, I hope the above content can be of some help to everyone, you can learn more knowledge. If you think the article is good, you can share it so that more people can see it.

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.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report