html - CSS 图像在 while 循环中重叠

Question

我有以下 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 循环一切看起来都很好!

更新:

Answer 1

你定位.descdlcimg relative 顶部:-143px。这意味着

"position this image 143px higher than where it should be."

我认为您的图片“融化”到顶部的这 143 像素。如果您对此相对定位没有充分的理由(请注意:人们经常说 position: relative 而他们的意思是 position: absolute)只需删除它，它应该工作。