顯示內部100％高度div：table-cell div

我試圖在顯示器中放置100％高度div：table-cell div，但它在IE中似乎不起作用。任何解決方法的IE瀏覽器？顯示內部100％高度div：table-cell div

這裏是我的代碼：

<div style="display:table-row;"> 
    <div style="display:table-cell; background-color:blue; border-left:solid 1px #CCC;"> 
     <div style="position:relative; height:100%; width:100%; background-color:red;"> 
     </div> 
    </div> 
</div>

來源

2012-03-31 user1304988

添加在DIV的任何內容（包括圖像）之前執行

.load被調用。或定義最小高度。 – 2012-03-31 12:41:44

父div的高度和寬度設置自動。如果你想看到紅色div，你初始化你的父div div的高度和寬度。

<div style="display: table-row;"> 
    <div style="display: table-cell; background-color: blue; border-left: solid 1px #CCC;height:20px;width:30px;"> 
     <div style="position: relative; height: 100%; width: 100%; background-color: red;"> 

     </div> 
    </div> 
</div>

來源

2012-03-31 12:44:27

在完整的代碼中，我有其他固定高度的表格行，我需要這個表格行來獲取表格高度的其餘部分，所以我不能把一個固定的高度。 – user1304988 2012-03-31 13:05:36

對不起，我似乎無法得到它的工作。我也試着尋找答案，但很多人似乎都有這個問題。 – GolezTrol 2012-11-14 10:20:37

我意識到這是一個相當老的帖子，但是我發現自己在這裏尋找一個解決方案。

我結束了使用一點，但jQuery。（「.COLUMN」指的是我的：表電池元件）

jQuery(document).ready(function($){ 
    $('.column').each(function(){ 
     var $this = $(this) 
     $this.height($this.height()); 
    }); 
});

這迫使一個明確的高度等於所述高度流動的使.COLUMN內我與100％的高度的元件實際裝配的整個寬度。

工程在Firefox，鉻和IE的當前版本9.

修訂：如果這將實現高度的表格，電池元件內加載圖像，那麼你將要運行jQuery的上面的代碼（窗口）.load（）來代替。 Chrome在document.ready處有圖像尺寸方面的問題。移動上面的代碼.load修復了這個問題。之後所有元素都加載VS。就緒可以所有元素被加載

來源

2013-03-27 16:50:17 user2199786

顯示內部100％高度div：table-cell div

回答

相關問題