`
andrew1024
  • 浏览: 70908 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

DIV+CSS 自适应高度(在IE6、IE7、fireFox下测试通过)

阅读更多
做一个浏览器兼容的项目老是遇到这样的问题!把这个解决方法记下来:

之前遇到Div不自适应高度解决的办法就是在最底下加多个空的Div清除两边的浮动,代码如下:

<div style="clear:both"></div>

不过应用这个方法如果Div嵌套过多中间浮动过于复杂容易使页面乱掉而,最近找到了新的处理办法,就是可以直接在外层想让其"自适应高度"的Div添加以下属性:

style="height:100%; overflow:auto;"

呵呵,然后发现一个很奇怪的现象,就是如果只添加"height:100%; "(设置高度100%)就IE下可以自适应高度而FireFox不行,如果只添加"overflow:auto; "(设置溢出自动)就FireFox下可以自适应高度而IE不行,所以完美的解决办法就是"height:100%; overflow:auto;"两个属性同时添加进去就可以了...
分享到:
评论

相关推荐

    子div含float,父div高度自适应的div+css布局写法

    div+css高度自适应网页布局,子div含float,父div高度自适应,已经通过测试的浏览器:ie6、ie7、ie8、火狐、Chrome。 代码来源: http://www.positioniseverything.net/articles/onetruelayout/equalheight

    CSS文集

    利用CSS的Expression自定义属性来实现表格的OnMouseOver 特效 需要掌握的八个CSS布局技巧 用css实现链接经过时显示浮动图片背景的效果 自适应大小的CSS圆角盒子 div+css实现Firefox和IE6兼容的垂直居中...

    div+css最小高度的实现代码(兼容ie6/ie7/ie8/firefox)

    我们在用DIV+CSS布局文章内容页面的时候,往往会让DIV或其他元素自适应高度,可是当发布者发布的内容比较少的时候,比如只有一行字,那内容部分就变的很小,不美观,可是我们直接设置一个高度的话,当内容很多时又会...

    div+css最小高度的设置方法兼容各浏览器ie6+/Firefox

    我们在用DIV+CSS布局文章内容页面的时候,往往会让DIV或其他元素自适应高度,可是当发布者发布的内容比较少的时候,比如只有一行字,那内容部分就变的很小,不美观,可是我们直接设置一个高度的话,当内容很多时又会...

    完全纯css实现div自适应居中兼容IE7 Chrome FireFox

    纯CSS,完全无需JS实现自适应居中并且兼容IE7+ Chrome FireFox 等,对JS程序猿来说一种解放,下面有个不错的示例,大家可以参考下

    div+css有实例,易学易懂

    div+css有实例,易学易懂第1 章 Web 标准布局的本质 第8 页 1.1 为什么要建立Web 标准 1.1.1 建立Web 标准的目的 1.1.2 使用Web 标准的好处 1.2 什么是Web 标准 1.3 内容、结构和表现 1.4 两种思考方式 1.5 Web 标准...

    js解决div内图片自适应大小

    纯js实现在img图片大小未知,div大小未知的情况下,让图片自适应大小,需要的朋友可以参考下 已测试,兼容火狐,谷歌,IE6,IE7/8

    Firefox div高度自适应

    1.如果div想要一个最小高度,那么应该用css的minheight这个属性,但是IE不支持,考虑到大多数用户都使用IE,所以一般情况下这个属性基本上弃置不用。在IE里面,height基本上就可以当作minheight来用,因为如果内容...

    自媒体简洁新闻资讯类网站模板+手机端自适应+前后端代码

    本模板自带eyoucms内核,无需再下载eyou系统,原创设计、手工书写DIV+CSS,完美兼容IE7+、Firefox、Chrome、360浏览器等;主流浏览器;结构容易优化;多终端均可正常预览。使用过程有什么问题可以加群交流。

    高端网络营销网站源码(响应式+手机平板自适应).rar

    完美兼容IE7+、Firefox、Chrome、360浏览器等、主流浏览器。 页面简洁简单,容易管理,DEDE内核都可以使用,附带测试数据。 源码特点: 1、网站手工DIV+css,代码精简,首页排版整洁大方、布局合理、利于SEO、...

    响应式驱动芯片电气类网站

    织梦最新内核开发的模板,该模板属于企业通用、HTML5响应式、气保焊、氩弧焊、手工焊、切割...完美兼容IE7+、Firefox、Chrome、360浏览器等;主流浏览器; 页面简洁简单,容易管理,DEDE内核都可以使用;附带测试数据!

    响应式 博客网站源码_新闻网站,自适应手机.zip

    完美兼容IE7+、Firefox、Chrome、360浏览器等;主流浏览器; 页面简洁简单,容易管理,DEDE内核都可以使用;附带测试数据! 模板特点: 1.一款利于SEO的模板,手工CSS+DIV,图片ALT,H系列标签已合理运用。 2.同步...

    【T599】黑白宽屏通用医院类仿上海整形医院整站模板.zip

    非常不错的一款织梦dedecms模板 大气简洁 自适应手机端 想做网站的朋友可以下 保证不会亏本...完美兼容IE7+、Firefox、Chrome、360浏览器等;主流浏览器; 页面简洁简单,容易管理,DEDE内核都可以使用;附带测试数据!

    【t595】WAP整形医院手机网站源码.zip

    非常不错的一款织梦dedecms模板 大气简洁 自适应手机端 想做网站的朋友可以下 保证不会亏本...完美兼容IE7+、Firefox、Chrome、360浏览器等;主流浏览器; 页面简洁简单,容易管理,DEDE内核都可以使用;附带测试数据!

    f_eyoucms426(自适应手机移动端)响应式农产品谷物大米食品粮食农业果蔬类企业网站易优模板下载.txt

    本模板自带eyoucms内核,无需再下载eyou系统,手工书写DIV+CSS,完美兼容IE7+、Firefox、Chrome、360浏览器等;主流浏览器;结构容易优化;多终端均可正常预览,该易优cms模板不单单适用于农产品,谷物,大米,食品,...

    简单大气新闻资讯博客类网站源码.zip

    织梦建站php源码 高端大气响应式手机端 自适应程序 建站必选 模板介绍: ...完美兼容IE7+、Firefox、Chrome、360浏览器等;主流浏览器; 页面简洁简单,容易管理,DEDE内核都可以使用;附带测试数据!

    简洁古典文学网站整站模板.zip

    织梦建站php源码 高端大气响应式手机端 自适应程序 建站必选 模板介绍: ...完美兼容IE7+、Firefox、Chrome、360浏览器等;主流浏览器; 页面简洁简单,容易管理,DEDE内核都可以使用;附带测试数据!

    紫色时尚类dede手机模板.zip

    织梦建站php源码 高端大气响应式手机端 自适应程序 建站必选 模板介绍: ...完美兼容IE7+、Firefox、Chrome、360浏览器等;主流浏览器; 页面简洁简单,容易管理,DEDE内核都可以使用;附带测试数据!

Global site tag (gtag.js) - Google Analytics