2010-12-10 33 views
1

ここでは取引があります。私は幅100%のコンテナDIVを持っています。そして、そのDIVの中に、何百もの空白のDIVがディスプレイに残っています。 (テスト用)オーバーフロー:自動およびDIV問題

私はoverflow-x:autoをコンテナに持っています。

最後のdivがコンテナ要素の最後に到達すると、それは他のDIVの行にとどまるのではなく、次の行にドロップし、コンテナのスクロールバーを開始します。

DIVが次の行にドロップしてコンテナのスクロール動作を強制的に実行するにはどうすればよいですか?

ありがとうございました。ここで

は助けるために写真です: alt text

+0

どちらも正しいです!どうもありがとうございます! – Alex

答えて

3
<html> 
    <head> 
     <style type="text/css"> 
      #container { 
       white-space:nowrap; 
      } 

      .child { 
       background-color:#dddddd; 
       display:inline-block; 
       height:100px; 
       width:100px; 

       /* Trick FF2 into using inline-block */ 
       display:-moz-inline-stack; 

       /* Trick IE6 into using inline-block */ 
       *display: inline; 
       zoom:1; 
      } 
     </style> 
    </head> 
    <body> 

     <div id="container"> 

      <div class="child">.</div> 
      <div class="child">.</div> 
      <div class="child">.</div> 
      <div class="child">.</div> 
      <div class="child">.</div> 
      <div class="child">.</div> 
      <div class="child">.</div> 
      <div class="child">.</div> 
      <div class="child">.</div> 
      <div class="child">.</div> 

     </div> 

    </body> 
</html> 
+0

私はDIVにピリオドを入れていることに気付きました。 これは、DIVが正しく動作するためにDIVの内部に何か必要があることを意味しますか? – Alex

+0

DIVにコンテンツを入れる必要はありません。それはコードをテストするための方法でした – michael

1

あなたがwhite-space:nowrap;を試してみましたか?

float:left;ではなく、display:inline-block;を使用するように切り替える必要がある場合もあります。

関連する問題