2个左侧浮动div，具有固定大小和自动宽度

您好，我遇到CSS设计问题。我有2个浮动div，其中第一个始终是200像素宽度，其中第二个div必须是页面宽度的其余部分。这怎么办？我已经tryed宽度：汽车和100％2个左侧浮动div，具有固定大小和自动宽度

<div style="float: left; width: 200px"> 
</div> 
<div style="float: left;"> 
</div>

来源

2011-06-06 Androme

最近给你的例子：

<div style="float: left; width: 200px;"> 
</div> 
<div style="margin-left: 200px;"> 
</div>

来源

2011-06-06 13:16:50

删除我的答案。我不喜欢我在做什么。为你+1。 – wdm 2011-06-06 13:41:56

它的工作，但格被调整到它的内容里面是空的，现在，如果你想保留它为空，尝试“显示：块;

来源

2011-06-06 13:05:55 Alexcp

我认为这可能是你在找什么

Expand div to max width when float:left is set

来源

2011-06-06 13:08:11

你不需要第二<div>试试这个：。

<html> 
    <body> 
     <div style="float: left; width: 200px; margin-right: 20px;"> 
      Floating Content 
     </div> 
     Main Content 
    </body> 
</html>

主要内容将围绕浮动底部<div>，所以如果你不想这样做，你将不得不设置高度。

来源

2011-06-06 13:13:47 FishBasketGordo

到目前为止，这里最好的技巧就是只float左div：

http://jsfiddle.net/8y2t2/

#left { 
    width: 200px; 
    float: left; 
    background: #ccc 
} 
#right { 
    background: red; 
    overflow: hidden 
} 
<div id="left">left</div> 
<div id="right">right</div>

从做奖金这种方式您不需要将左侧的div的宽度指定为width和margin-left（正如在这里的其他答案）。这要感谢overflow: hidden。

比较：http://jsfiddle.net/8y2t2/1/ VS http://jsfiddle.net/8y2t2/2/

如果你想多个实例：http://jsfiddle.net/8y2t2/3/

来源

2011-06-06 13:22:10 thirtydot

2个左侧浮动div，具有固定大小和自动宽度

回答

相关问题