親要素の幅を超えるときに浮動小数点要素が折り返さないようにする

Question

ブロック要素が親要素の幅を超えたときに折り返されないように方向を変えて浮動できるかどうかを知りたいと思います。

これはすばやく簡単な質問でした。もう少し詳細と例については、下記をご覧ください。

私はこれに関するいくつかの研究を行っており、それが不可能かどうかの明確な答えを見つけられていないため、これを行うことができるかどうかの明確な答えを探しています。

そして、それができない場合は、CSSの仕組みを理解するために簡単に説明していただきたいと思います。

次の例を参照してください。

私は1 "コンテナ" divを持っており、その中に3つの "row" divがあります。 「コンテナ」の仮想幅が200ピクセルで、各「行」の仮想幅が100ピクセルであるとします。これらの値はCSSでは指定されていませんが、ページの内容によって異なります。

各「行」は、水平に表示されるように左に浮かびます。 「行」の合計幅が「コンテナ」の幅を超える場合この場合

<div class="container"> 
    <div class="row"> 
     Some text 
    </div> 
    <div class="row"> 
     Some text 
    </div> 
    <div class="row"> 
     Some text 
    </div> 
</div> 

.row { 
    float: left; 
} 

、それは「ロー」のラップしない単一の水平ラインに留まることが可能ですか？

ちょうど強調するために、異なるコンテンツに対応するためにレイアウトを動的にしたいので、CSSの「コンテナ」の正確な幅を指定することはできません。

ありがとうございます。

Answer 1

単一行の行を維持する一方overflow:hiddenを持つことができます。 （フロートなど）の側でhttp://jsfiddle.net/XYzea/1/容器内部の

ブロックが並んでいる側が、その親が指定された何の幅を持っていない：

このフィドルを参照してください。ちなみに、ラッパーは入れ子になったdivを囲みます。 inline-block works IEを除く最新のブラウザ< 8要素が自然のブロック要素の場合、その表示プロパティを任意のハックで使用することはできません

Answer 2

私が考えることができる唯一の方法は、コンテナ>ラッパー>行を持つことです。コンテナのサイズは動的なものとラッパーが、あなたが探している行動がdisplay: inline-blockでfloat: leftを交換し、親コンテナにwhite-space: nowrapを有することによって達成することができる