2012-02-08 7 views
1

私はdivのリストを同じ行に表示しています。ページが同じ行のすべてのdivを表示するのに十分な大きさでない場合、私は余分なdivを次の行に表示したくありません。新しい行に余分なdivを表示しないようにするにはどうすればよいですか?ここで新しい行に表示されるdivを避ける方法

はjsFiddleです:http://jsfiddle.net/YCFZM/

は、ページ上の幅を小さくしてみてください、あなたは、いくつかのdivは新しい行に表示される表示されます。

ありがとうございました。スタイルシートで

+0

div数は固定されていますか? – knub

+0

Yuor jsFiddleコードが無効です。それを修正して新しいURLを投稿してください。 –

答えて

1

更新要旨:http://jsfiddle.net/Meligy/YCFZM/16/

主な変更点:

  • HTMLで削除余分な引用id=""sidebar"div#sidebarに追加white-space:nowrap;
  • CSS div#sidebarから要旨
  • 削除height: 0px;を破りました。 CSS
  • 削除済みfloat:leftを追加しましたwhite-space: nowrap; display:inline-block;
  • CSS div.sidebar-itemから必要に応じて

CSS div.sidebar-itemにテキストが左になり作るためのものならば、あなたも div#sidebar CSSから text-align:center;を削除することができます。

0

は、doc限り私の知識はこれに対する唯一の解決策は、コンテナの固定幅を持つことである行くよう

0

のインライン値の表示属性を使用します。または、コンテナ内に固定幅のある要素を持つようにする

0

divを取り囲むのに十分な大きさのmin-widthを設定する必要があります。また、あなたのスタイリングが適用されないようにしていたjsfiddleに余分な引用符がありました。何らかの理由でheightプロパティが0に設定されました。私はあなたのjsfiddle hereを私はあなたの後に思う動作を表示するために適応しました。溶液で

+0

Mohamed Meligyのソリューションははるかに優れています。 – magicalex

関連する問題