我們都知道，寬度自適應，有很多種辦法，最簡單的就是百分比的方法，來進行寬度自適應，麻煩點的去js裡面進行獲取螢幕的寬度去進行判定，這樣的方法來進行自適應，但今天我遇到個問題，對已寫好的頁面進行二開，要做到自適應的程度，結果把寬度自適應了，但以前的高度是寫死的，導致頁面縮小或變成手機端時，出現了頁面坍塌。給父元素的高度，進行了height：auto；結果一點反應都沒有。後來查資料才知道，由於我的子元素有浮動的效果，所以單獨設父元素高auto，是起不到一點作用的。現在給大家分享下兩種高度自適應的辦法：

    隨著微軟新作業系統的上市，ie6現在用的人越來越少了，但是XP系統看來是太過經典，仍然有相當多的使用者在使用，且這部分人群中的大部分也沒有單獨升級瀏覽器的習慣，於是乎ie6依舊是使用最多的瀏覽器版本。根據本站流量的統計，來自ie6的訪問比重為72.6%。表明了以上的觀點，雖然最高的時候，ie6佔了90%以上。

言歸正傳，div+css作為網頁的佈局已經是大勢所趨。它的優點不在這裡囉嗦。但最近經常有朋友提到關於容器高度自適應的相容性問題。在這裡簡單作答。

1.有些時候，我們希望容器有一個固定高度，但當其中的內容多的時候，又希望高度能夠自適應，也即容器在縱向能被撐開，且如果有背景，也能夠自適應。在一般情況下，使用min-height即可解決。但是廣大網民的首選瀏覽器ie6並不支援min-height。ie7,opera,火狐沒有問題。所以採用以下寫法可以解決相容性： 

height:auto!important;
height:200px;
min-height:200px;

2.很多朋友反映用上面的方法後，在有些時候依然無法解決容器無法撐開自適應的問題。那一定是有容器巢狀的情況下，而子容器又是浮動的。例如
<div class="fuqin"><ul><li>內容1</li><li>內容1</li></ul></div>
其中class為fuqin的div有浮動的li，當li比較多的時候，即便是div設定的是最小高度，也無法被撐開。

原因就在於作為子容器的li是浮動的即 。在這種情況下，即便是li的內容超過了div的高度，div也無法撐開。

解決方法如下：
在浮動的容器後面，父容器結束之前加入一個div

<div class="fuqin"><ul><li>內容1</li><li>內容1</li&gt;</ul><div class="clearfloat"></div></div>
.clearfloat{clear:both;height:0;font-size: 1px;line-height: 0px;}