最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
css div设定最小高度又自适应高度
时间:2011-08-17 编辑:简简单单 来源:一聚教程网
经常使用div布局的盆朋友应该有过这样的经验,并且这样的情况并不少见:有一个 div,当它里面的内容超过它的高度时,让这个 div 的高度随内容自动变化(自适应),但是如果内容很少时,又想让这个 div 的高度保持一个固定的最小值,这样问题就来了,我们都知道,div 在 IE7、IE8、Firefox、Opera 和 chrome 中不设置高度(或者 height:auto )的情况下,其高度是自适应的,但如果设了高度,超出部分会自动隐藏,既(overflow:hidden),但是 IE6 这小子可不吃这一套,即使设置了高度,内容超过它的高度时也会自动被撑开。
现在,我们假设这个div的高度是240像素,对于这种情况,我们可以使用:
.mydiv {
height:auto !important;
min-
}
说明:
IE6 识别不了 height:auto !important 和 min-,因此它的高度是240px,前面说过,IE6内容超出时 div 的高度会随着内容的高度页变(自适应),IE7、Firefox、Opera、Chrome 可以识别 height:auto !important ,注意这个!important 关健字在 CSS 中的优先性是大于后面的 的,因此它的渲染结果中只接受了 height:auto !important 和 min-,这一句就可以理解为 height:auto, min-,就这样,很简单吧。
-
上一个: HTML中图文混合引发莫名空白问题研究
相关文章
- CSS实现iframe高度自适应示例 04-27
- CSS中 浮动float 高度自适应 10-23
- css中overflow解决float浮动后高度自适应的问题 07-09
- css DIV三列高度自适应 12-12
- css因float引起div高度自适应无效解决方法 12-06
- css float引起div自适应高度无效解决方法 10-31