0

HTMLコード:

<div class="goleft"> AD 300x250 size </div>


        <div class="itemImageBlock goleft">
              <span class="itemImage">
              <img src="/media/k2/items/cache/c3997142576e6f4d163ead570965368d_S.jpg" alt="Pranab Mukherjee" style="width:300px; height:250px;" />
          </span>

        </div>

CSS:

.itemImageBlock { margin:0 0 16px; padding:0; text-align: center; clear: both; }
span.itemImage { display:block; text-align:center; margin:0 0 8px 0; }
.goleft{
    float:left
}

これらの2つのブロックは次々に来ています。これらを並べて配置したい。

これを達成するために私を助けてください。

divブロック(最初の画像、次の広告)の順序を変更すると、機能します。しかし、私は最初の広告と次の画像が欲しいです。

画像のURL:http ://tinypic.com/r/2ih5hco/6

前もって感謝します。

4

3 に答える 3

0

cssコードにクラスを追加するだけで、混乱がなくなります...

CSS

.goleft{
    float:left
}

このクラスをDOMに追加します-

       <div class="itemImageBlock goleft">
              <span class="itemImage">

              </span>
         </div>
         <!-- Advertisement(300x250) -->
          <div class = "goleft">
          </div>
于 2012-07-03T17:26:06.970 に答える
0

問題は.itemImageBlockCSS宣言にあるようです。clear:bothCSSを削除すると、DIVが整列します。参照: http: //jsfiddle.net/pe6s5/

于 2012-07-03T18:22:54.520 に答える
0
.itemImageBlock {padding:0;
    text-align:center;
}
span.itemImage {
    display:block;
    text-align:center;
    margin:0 0 8px 0;
}
.goleft{
    float:left;
}

<div class="goleft"> AD 300x250 size </div>
<div class="itemImageBlock">
    <span class="itemImage">
        <img src="/media/k2/items/cache/c3997142576e6f4d163ead570965368d_S.jpg" alt="Pranab Mukherjee" style="width:300px; height:250px;" />
    </span>
</div>
于 2012-08-10T17:18:20.867 に答える