Question

我怀疑这可能需要Flexbox（或者只是简单易用），但也许有人有想法/解决方法。我有这样的结构：

<section>
  <div>Some Text Here</div>
  <div></div>
</section>

截面宽度：100％。我希望第一个div（左浮动）根据文本拉伸到不同的宽度，我希望第二个div占用部分剩余的百分比。每个div可能包含浮动内部的各种其他div（并且它们反过来将使用百分比作为宽度）。这可能吗？

编辑：好吧，我认为更大的问题是，在第二个div中，我有一个％宽度的浮动div，但是它的父级是宽度自动...所以它将无法正常工作？ Codepen

Answer 1

您可以通过将一个DIV指定为左浮动而将其他DIV指定为自动（因此它使用剩余的空间）来执行此操作

div:first-child { /* div on the left, width as per content */
    float: left;
    width: auto;
    background-color: #777;
}
div:last-child { /* div on the right, uses remaining width */
    background-color: #77f;
    width: auto;
}

选中演示：http://jsfiddle.net/pQc3d/1/

流体宽度div相对于兄弟

1 个答案: