0

私は次のHTMLコードを持っています:

(このコードは、画像、製品タイトル、および基本的な説明を含むボックスを作成します)

<?php
  while ($row = mysql_fetch_row($q3)) {
    echo "<div class='ipsBox_containerdlc ipsPad'>
<h3 class='ipsType_subtitledlc'>".$row[2]." </h3>
<br>
<p class='descdlc'>".$row[4]."</p>
<p class='descdlcimg'>
<img src='http://localhost/images/249273625.jpg' width='200' height='219'/>
</p></div>
";
  }
?>

およびCSSコード:

.descdlc {
font-size: 12px;
color: #777777;
    position:relative;
    left:375px;
    width:375px;
}

.descdlcimg {
font-size: 12px;
color: #777777;
    position:relative;
    top:-143px;
    left:100px;
    overflow:hidden;
}

.ipsBox_containerdlc {
    background: #fff;
    border-left: 1px solid #CECED1;
    border-right: 1px solid #CECED1;
    border-bottom: 1px solid #CECED1;
    border-top: 1px solid #CECED1;
            height:240px;
    }

問題は、while ループを使用すると画像が「オーバーラップ」することです。

それを修正する方法はありますか？while ループがなければ、すべて問題ないように見えます。

アップデート：

4

2 に答える 2

0

.descdlcimg で相対的に配置しtop: -143pxます。これの意味は

「この画像をあるべき場所よりも 143 ピクセル高く配置してください。」

あなたの画像は、これらの143pxだけが一番上に「溶ける」と思います。この相対的な位置付けに正当な理由がない場合 (注意: 多くの場合、人々position: relativeはposition: absolute.

于 2013-06-19T08:30:02.607 に答える