[英]float left isn't expanding in IE6
我有css代碼,即時通訊使用float擴展左列a和右列b 。
我想擴大左欄動態正如我在右列b將內容。
但這在我的瀏覽器IE中沒有發生。 它可以在http://jsfiddle.net/hadinetcat/E8jd3/3/中運行,但不能在我的瀏覽器中運行IE 9,8,7,6,但IE 10可以正常工作。
.container {
border: 1px solid #000000;
overflow: hidden;
width: 100%;
height:100%;
position:relative;
}
.left {
width: 45%;
float: left;
background:none repeat scroll 0 0 lightblue;
height:100%;
position:absolute;
}
.right {
width: 45%;
float: right;
}
<div class = "container">
<div class="left">
column a
column a<br />
column a<br />
column a<br />
column a<br />
column a<br />
column a<br />
</div>
<div class="right">
column b<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />dynamic row<br />dynamic row<br />dynamic row<br />dynamic row<br />dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
dynamic row<br />
columnb <br />
columnb <br />
columnb <br />
columnb <br />
columnb <br />
columnb <br />
columnb <br />
columnb <br />
</div>
</div>
<div style="clear: both;"></div>
嗨,我已經更新了JSFiddle中的代碼,(注意:我也包括jquery),您需要包括該javascript。
它也在IE6中進行了測試。 因此,它也可以在其他瀏覽器中使用。
check it here : http://jsfiddle.net/btCQn/1/
<style>
.container {
border: 1px solid #000000;
overflow: hidden;
width: 100%;
position:relative;
}
.left {
width: 45%;
float: left;
background:none repeat scroll 0 0 lightblue;
position:absolute;
}
.right {
width: 45%;
float: right;
}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(".left").css("height",$(".right").height());
});
</script>
它的工作
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.