horzontallyの浮動小数点div

Question

divsを水平に浮かそうとしていますが、新しい行に落ちています。

http://jsfiddle.net/nyCrY/4/

それは私がその内容よりも高い#holderの幅を設定した場合のみ動作します。

固定幅を#holderに設定せずにこれを行う方法はありますか？

ありがとうございました！

Answer 1

純粋なCSSはありません。

静的な幅を使用することはできません。浮動小数点+空白（信頼性が低い）を使用することも、javascriptで必要な幅を動的に計算して、スタイルの幅を数。

このチュートリアルによると：http://css-tricks.com/how-to-create-a-horizontally-scrolling-site/

私は、私は、ブラウザの自動折り返しを戦うために方法を見つけることができるかどうかを確認するためにフロートプロパティと空白 プロパティで遊んでいくつかの時間を費やし けど多くの運がなかった。浮動しているが、 の幅を持たないページ要素は、その内部の内容の幅が に拡張されるプロパティを示します。私はおそらくfloatの束を 要素の中に入れれば、ブラウザウィンドウの幅 を超えて拡大し続けるかもしれないと思った。サイコロはありません。空白もあります：nowrap; CSSの私は、自動ラップを と戦うために悪用される可能性があると思っていましたが、テキスト要素、ブロックではなく、または あなたがインラインに設定したものだけで動作します。しかたがない。

だから、彼は基本的には、単にCSSでは不可能だと言っています。

しかし、彼はあなたがそれを達成するために、いくつかのJavaScriptのマジックを行うことができると言うことを続く：

JavaScriptが明確にページ要素を操作し、オンザフライ 計算を行う能力を持っています。