如何使浮动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填满剩余宽度？

回答

相关问题