2

これには Flexbox が必要になるのではないかと疑っていますが (または単に簡単に使用できるようになるかもしれません)、誰かがアイデア/回避策を持っているかもしれません。私はこのような構造を持っています:

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

セクションは幅: 100%。最初の div (左にフローティング) をテキストに応じてさまざまな幅に拡大し、2 番目の div がセクションの残りのパーセンテージを取るようにします。各 div には、おそらく内部に浮かぶさまざまな他の div が含まれます (そして、それらは幅にパーセンテージを使用します)。これは可能ですか？

編集:わかりました、より大きな問題は、2 番目の div に % 幅のフローティング div があるという事実だと思いますが、その親は幅の自​​動です...それでうまくいきませんか? コデペン

4

1 に答える 1

1

これを行うには、1 つの DIV を左フローティングとして指定し、他を auto として指定します (したがって、残っているスペースはすべて使用されます)。

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/

于 2012-10-29T18:33:19.087 に答える