Question

您好我正在创建一个分页脚本，我已经完成了所有工作，现在我正在尝试制作索引页面，它将包含从数据库中检索到的数据，我希望在表单上显示第2个div为第一个为缩略图，另一个将包含缩略图下的标题。所以这是我的代码：这是循环它没关系，我只是想让你看到里面的HTML代码。

$brk_cnt = 0;

while($row = mysqli_fetch_array($results))
{
 echo ' <td>
        <div class="datamore">'.$row['thumbnail'].'</div><div class="data1r1">$row['title']</div>
        </td>';

 //break or print <tr> condition
 if(++$brk_cnt % 4 == 0)
 {
    echo '</tr><tr>';
 }
}


echo '</table>';

和css：

.data1r1 {
width:198px;
height:235px;
background-color:#4D72B7;
border-radius:5px;
/* border shits */
border:1px;
border-color:black;
border-style:solid;
border-radius:5px;
clear:both;

}
.datamore {
width:198px;
height:150px;
background-color:#C7441A;
position:absolute;
border-radius:5px;
clear:both;
}
#table {
    margin-left:250px;
    margin-top:20px;
    position:absolute;
}

我虽然我最初使用的是正确的css，但是在打印数据时这不是一个好结果，这就是div的样子：

divs http://img11.hostingpics.net/pics/949037test.png

2个div是另一个上面的那个..我想让橙色的那个下面的蓝色。感谢抱歉这个长篇描述，但我想说清楚。

Answer 1

删除位置：绝对

.datamore {
 width:198px;
 height:150px;
 background-color:#C7441A;

 border-radius:5px;
 clear:both;
}

Example

Answer 2

替换位置：绝对位置：相对

.datamore {
width:198px;
height:150px;
background-color:#C7441A;
position:relative;
border-radius:5px;
clear:both;
}

如何使div成为另一个

2 个答案: