php - 我在 html 上的 CSS 代码错误(未正确匹配)

Question

我的小网页培训元素遇到了一些问题。我写这个问题页面是因为我的问题不太具体，而且我找不到适用于我的网页培训元素的解决方案。

我的网站截图 /image/dF0aF.png

HTML

<?php
if(!defined("INDEX")) die("--");
$artikel=mysqli_query($koneksi, "SELECT * FROM `Tabel Artikel` order by id_artikel desc");
while($data=mysqli_fetch_array($artikel)){
    $isi = substr($data['isi'],0,800);
    $isi = substr($data['isi'],0,strrpos($isi,""));
?>
    <div class="artikel">
        <h2 class="judul"><?=$data['judul'];?></h2>
        <p>
            <?php if ($data['gambar']!="") ?>
            <img src="../gambar/artikel/<?=$data['gambar'];?>" class="gambar-artikel" width="200">
                <?=$isi;?> ...
            <a href="?tampil=artikel_detail&id=<?=$data['id_artikel'];?>">Selengkapnya</a>
        </p>
</div>
<?php }
?>

CSS部分

.box{
    padding:10px;
    overflow:hidden;
}
.artikel{
    display:block;
    float:left;
    border-bottom:1px solid #ccc;
    margin-bottom:20px;
}
.gambar-artikel{
    float:left;
    padding:3px;
    margin-right:5px;
    border:1px solid #ccc;
}

正如您在我的网站图片上看到的那样，即使该表中有 sql 数据库中的数据，内容也不会正确地 float 在左侧，'$isi' 也不会出现。我希望有一些解决方案，以便每个内容都能正确地向左浮动，并且 $isi 会出现。我感谢任何建议。干杯!

Answer 1

所以我假设...您想将所有文章 (artikel) 放在左侧...添加 clear: both;给你的.artikel类

.artikel{
    display:block;
    float:left;
    clear:both;
    .
    .
    .
}

然后把你的$isi进入<span></span>或其他...文本现在位于图像“下方”