如何使浮動div填滿剩餘寬度？

我有一個div有float: left，並有一個div有float: right。具有float: left的div的寬度爲50px，而具有float: right的div應占用父div中的剩餘水平空間。如何使浮動div填滿剩餘寬度？

我該如何使用CSS來完成此操作？

來源

2013-02-12 think123

使用'保證金左嘗試：60px'沒有在正確的div使用'float' – mshsayem 2013-02-12 08:02:36

@mshsayem哦，嘿，那有效。作爲答案發布，獎勵是你的。 – think123 2013-02-12 08:03:26

你也可以把浮動div放在div「right」裏面。但我更喜歡@ mshsayem的解決方案。 – TheBronx 2013-02-12 08:05:41

嘗試使用margin-left:60px（或任何寬度您的左div可能），而不使用float在右分區。請參閱相關的小提琴這裏：http://jsfiddle.net/CKcQH/

CSS：

.leftDiv 
{ 
    width:50px; 
    float:left; 
    border:1px solid red; 
} 
.rightDiv 
{ 
    margin-left:55px; /* Compute total width of leftDiv */ 
    border:1px solid blue; 
}

HTML：

<div> 
    <div class="leftDiv"> 
     My content on left 
    </div> 
    <div class="rightDiv"> 
     My content on right should take all the space the parent has (after excluding the space on the left) 
    </div> 
</div>

來源

2013-02-12 08:03:48 mshsayem

我將按照承諾儘快接受。 – think123 2013-02-12 08:04:32

如何使浮動div填滿剩餘寬度？

回答

相關問題