Question

我需要做下一件事：

   max-width to center     content auto width    content auto width
<-----------------------><--------------------><-------------------->
          left                  middle                right

所以中间/中间列和右列将包含内容并且将自动增加宽度。但是左边的一个，我需要尽可能宽，直到碰到中间一个。

我现在拥有的是中间和右边，“浮动：正确”。并留下一个，“浮动：左”。

但有了这个，左边的宽度有限。

如何让它尽可能宽？

Answer 1

据我所知，这只能使用display: table来完成。如果我理解正确，this就是你想要的。它使div作为表格单元格，并将左边的一个设置为100％的宽度，自动填充任何备用空间。

Answer 2

让它们全部浮动。这样它们都会以最大宽度“倾斜”在左侧col上。

此外，您还需要一些宽度考虑因素或明确条件。

This will clear up a lot for you

Answer 3

试试这个：

http://jsfiddle.net/vcw7Q/

仅使用50-24-24％......

HTML

<div id="divLeft">
    div left to center
</div>    
<div id="divRight1">
    div right 1
</div>    
<div id="divRight2">
    div right 2
</div>

CSS

#divLeft{
    width: 50%;
    display: inline-block;
    background-color: forestGreen;
}
#divRight1{
    width: 24%;
    display: inline-block;
    background-color: blue;
}
#divRight2{
    width: 24%;
    display: inline-block;
    background-color: red;
}

CSS：3列布局，左动态全宽，中心和＆amp;正确的自动内容宽度

3 个答案: