代码改变世界

【浏览器兼容性】css解决IE、Firefox兼容的div高度100%的问题

2012-08-23 14:38  sniper007  阅读(1779)  评论(0编辑  收藏  举报

div高度100%的问题其实我们经常遇到,但是一直不知道怎么能够很好的解决。本文就是一个很容易解决IE、Firefox兼容的div高度100%的问题的文章,希望对大家有用。

其实解决起来很简单,就是在css的html和body里面加入height:100%属性,div的高度似乎不用设置成100%也可以实现。

原理:不同浏览器html和body的默认高度不同,比如IE6下html默认就是100%高度,body则不是;Firefox和IE更高版本下 html和body高度默认都不是100%,需要自定义。chrome浏览器默认也是100%的高度。所以我们需要重新设置一下。

 

代码如下:

 

    html, body {height: 100%;}
    #container 
{height: 100%;}

 

或者

 

    html, body {height: 100%;}
    #container 
{min-height: 100%;}
    * html #container 
{height: 100%;}