Firefox 100％高度，nobreak

我想用兩列100％高度構建模板。他們應該拼在一起作爲一列，一起約960px。Firefox 100％高度，nobreak

不知何故，Firefox做了它自己的事情，我只是不能得到兩列100％。

<div id="head">Menu</div> 
<div class="wrapper"> 
    <div class="wrapper2"> 
     <div id="left" class="inner">LEFT</div> 
     <div id="right" class="inner">RIGHT</div> 
    </div> 
</div>

來源

2013-02-18 dichterDichter

在這種情況下，我建議使用CSS表：

這裏是一個非常簡單的演示：http://jsfiddle.net/BbC4N/9/

來源

2013-02-18 10:18:28 otinanai

謝謝。我現在用'table'，'table-row'，'table-cell'。 – dichterDichter 2013-02-18 11:51:35

只是要記住'css'表在IE7中不起作用。 – otinanai 2013-02-18 11:52:45

在所有?,我只有IE8，我必須找到與IE7的電腦 – dichterDichter 2013-02-18 11:57:46

你可以嘗試使用jQuery：

var leftHeight = $('#left').height(); 
var rightHeight = $('#right').height(); 
if (leftHeight >= rightHeight) { 
    $('#right').css({'height':leftHeight}); 
} else { 
    $('#left').css({'height':rightHeight}); 
}

來源

2013-02-18 09:42:00

請查看這篇文章，它可以幫助你。流體寬度相等的高度專欄：http://css-tricks.com/fluid-width-equal-height-columns/

來源

2013-02-18 09:45:59

變化：

.wrapper { 
    display: table; 
}

到：

.wrapper { 
    display: block; 
}

我已添加到.wrapper { margin-top: 48px; }以使left和right div可見，並且在Firefox中一切似乎都適用於我。

Fiddle

來源

2013-02-18 10:21:34

很酷，謝謝。 – dichterDichter 2013-02-18 11:50:36

Firefox 100％高度，nobreak

回答

相關問題