次の構造のページがあります。
div.wrapper> div.content> div.item+div.item
ラッパーの幅は 320px ですが、この 2 つdiv.itemは約 600px になります。これらの 2 つをインラインで表示する必要があります (現在はdisplay: inline-block;で、ラッパーのコンテンツを水平方向にスクロールします。div.content幅をに設定するautoと、ラッパーの幅 (320px) が必要です。幅を 200% に設定すると、明らかに水平になります。スクロールは機能div.contentしますが、水平スクロールを可能にするためにコンテンツの幅を取得するにはどうすればよいですか?
注: ラッパーは固定の幅と高さに設定されておりoverflow-y: hidden、垂直方向のスクロールが必要ないoverflow-x: scrollため、水平方向のみに設定されています。
例を含む JSFiddle: http://jsfiddle.net/kh5k7/
ご覧のとおり、赤い div が垂直に積み重なっています。幅を 200% (または何らかの値) に変更.contentすると、水平スクロールが正しく行われます。.contentただし、事前にdiv に含まれる要素の数がわからないため、これを自動的に実行したいと考えています。