-4

私は次のようなデザインを持っています：

ブロック（1番目、2番目、3番目、または4番目）の後に新しいdivを追加すると、その下にあるdivが壊れます。

最初のdivの後にdivを追加すると、デザインは次のようになります。

divのCSSルールは次のとおりです。

width: 430px; margin-bottom:40px; float:left(for 1st and 3rd) or right(for 2nd and 4th)

追加されるdivのCSSルール：

height:20px; width:20px; clear:both; overflow:hidden

この問題の原因は何ですか？

なぜ下のdivが下にスライドするのではなく、右に配置されるのですか？

4

3 に答える 3

0

テーブルを使用することをお勧めします。そうすれば、問題は簡単に解決できます。

于 2013-02-16T08:28:53.403 に答える
0

CSS:

  .div
        {
            width: 400px;
            margin: 20px;
            float: left;
            border: 1px solid #000;
        }
        .divwrapper
        {
            width: 900px;
        }

HTML:

<div class="divwrapper">
        <div class="div">
            Hello 1Div
        </div>
        <div class="div">
            Hello 2Div
        </div>
        <div class="div">
            Hello 3Div
        </div>
        <div class="div">
            Hello 4Div
        </div>
    </div>
于 2013-02-16T08:31:18.100 に答える
0

次のようなすべてのdivのcssを記述する必要があります

div{
   width:80px;
  float:left;
  border:1px solid black;
  padding:5px;
  margin:5px;
  height:50px;
}

しかし、単純なテキストではcssソリューションは提供されないと思います。それで

フィドルhttp://jsfiddle.net/pvnq8/1/を参照してください

于 2013-02-16T08:33:44.540 に答える