高手解決IE中盒子模型滾動條有什么妙招

其實不要看我們平時使用IE瀏覽器都是簡簡單單的，打開瀏覽器，輸入所需網址，就完事了。可是當面對，稍微比較深奧的問題時，大家就搔頭抓耳了。就比如關于瀏覽器盒子模型的滾動條的問題。下面，小編就此問題進行詳細的講述。
【高手解決IE中盒子模型滾動條有什么妙招】先看圖：

瀏覽器盒子模型的滾動條
那么我們來看容器高度：
假如內容固定，表格也固定，那么你可能設置成固定高度，但是假如表格下還有內容，還正好取出來的數據不夠表格的最大行數據(比如每頁10行，結果一共才4行)，那么會出現一大塊空白，所以可能更多的情況下你還是設置的是動態高度，其實就是100%啦。
既然是100%，那么為什么出現了豎滾條呢?首先，只有在IE下才出現這個滾動條，那么顯然，肯定又是盒子模型對高寬的理解不同了。
假如真實內容高度現在是500Px，因為橫滾條(假定有12px)的出現， W3C可能認為高度就是512px了，那么事情就解決了，容器是512，內容是512 。
可是IE顯然不這么計算，你現在內容高度是500px，那么我的100%算出來的就是500px，現在出現了橫滾條怎么辦?
1，它必須在容器里出現(本例中就是外圍的DIV);
2 ，只要一出現，必須會把實際內容追加成512px;
這樣就出現了上面的結果，計算的高度和實際高度不符，于是滾動條就出現了。這時候來解決問題：
開始認為，既然這是不應該出現的滾動條，那么就讓它不顯示不結了?于是給容器加style：overflow-y:hidden;
結果一運行，不對， 512px的內容被你強制改成了500px還不讓滾動，必然有12px的內容無法顯示，因為滾動條的級別比較高，所以不能顯示的其實就是內容區的最后那12px，顯然不能這么做
最后沒辦法，只有先判斷它是否IE，(IE8引擎已經有所改變，那就判斷IE7吧)，然后再插入一行(具體幾行根據瀏覽器實際情況定，上述數字都是假的，為了描述方便)，在這個時候，再讓滾動條不出現，這樣問題就解決了，
在這種情況下，IE7事實上確實有部分內容無法顯示，但無法顯示的是你插入的無意義的空行。
插入的代碼你應該明白，是這種：
《!–[if IE 7]》
《p》《/p》
《![endif]–》
看效果：