0

私はこれを理解できないようです。

次のコードがあります。

<div id="wrapper">
    <div class="schedule">//blah</div>
    <div class="schedule">//blah</div>
    <div class="schedule">//blah</div>
    <div class="schedule">//blah</div>
    //
</div>

div #wrapper を固定幅にしたい。そして、各 .schedule も固定幅にしたい。次に、div が多すぎる場合は、そのページ内を左右にスクロールできます。

私はこれを行うことはできません ！何を試しても、さらに .schedule を追加すると、ページの一番下に表示され、次の行に入力し始めます!

乾杯 こうしゃ

編集：ありがとう。すべての結果が機能します。ただし、float: left; を使用できるようにする必要があります。または、すべての div が互いにストックされるようにします。どうやってやるの？

4

3 に答える 3

1

ライブデモ

こんにちは、このCSSに慣れました

#wrapper{
min-width:200px;
  background:red;
  font-size:0;
  white-space:nowrap;

}
.schedule{
height:100px;
  font-size:12px;
  width:100px;
  background:green;
  margin:1px;
  display:inline-block;
  vertical-align:top;
}

デモ

レイアウトに応じて幅または高さに変更します........

于 2012-09-20T06:28:34.967 に答える
1

あなたが望むのは、スケジュール div をフロートさせて同じ高さに揃えることだと思います。

これをcssに追加してみてください：

 #wrapper{overflow:auto;}

.schedule{float:left;}

仕様を誤解していたら申し訳ありませんが、それがあなたが本当に望んでいることだと思います。

于 2012-09-20T06:28:36.430 に答える
1

以下の CSS で実現できます。

#wrapper {
    overflow-x: auto;
    white-space: nowrap;  
    max-width: 300px;
    border: 1px solid red;
}
#wrapper .schedule {
    display: inline-block;     
    padding: 5px;        
}

基本的なJSFiddle デモンストレーションをまとめました。

于 2012-09-20T06:28:13.250 に答える