在FF下DIV層里包含的是DIV層,而不是內(nèi)容文字的話,背景圖是不會自動適應(yīng)高度的,無憂布局的時候用到了背景自適應(yīng)高度,就順手發(fā)來,與大家一起分享.

收集整理了三種解決方法.

首先我們定義三個層.

<div id="container">
<div id="main" /></div>
<div id="sidebar" /></div>
</div>

第一種:

設(shè)定CSS

#container { display:table}

container作為最外層，在IE下背景圖可以自適應(yīng)，但在FF下只有main層與sidebar層可以.
只需定義#container { display:table}就可以了，原理是和以前的表格布局是一樣的．
只是這樣的話會出現(xiàn)float層出錯,不推薦使用.

第二種:

設(shè)定CSS

#container{height:100% }
#main{height:100% }
#sidebar{height:100% }

這樣就兼容了IE ,FF，比起display:table;的方法好些。display:table;會導(dǎo)致一些布局出錯。

第三種:

設(shè)定CSS

#container:after {
 content: ".";
 display: block;
 height: 0;
 clear: both;
 visibility: hidden;
}

:after（偽對象）--設(shè)置在對象后發(fā)生的內(nèi)容，通常和content配合使用，IE不支持此偽對象，非Ie 瀏覽器支持，所以并不影響到IE/WIN瀏覽器。
無憂現(xiàn)在使用的就是這種方法.

如果您有其他好的方法,期待您留言發(fā)表.

本文來自模板無憂,轉(zhuǎn)載請注明出處 模板無憂(www.hl5o.cn)