在while中包装图像旁边的文本

时间:2013-08-11 15:16:03

标签: php css

我正在尝试修复搜索功能显示结果的方式。我会附上代码,然后我会用其他细节填写你。这是php和html部分:

$counter = 0; 
echo "<div class='box_afisare'>";
    while($result = mysql_fetch_array( $resulta )) 
    {   $poza=$result['id_oferta'];
        $p="SELECT * FROM poza where id='".$poza."'";
        $rez2 = mysql_query($p); 
        ++$counter;
        $modulo = $counter % 2;
        ?>
        <div class="border">
        <!-- DE MODIFICAT LOCALHOST -->
        <img  src="http://localhost/design/photo/images/<?php echo $poza ;?>/1-mini.jpg" id="poza"  />
        <?php
        echo "<div class='aranjare_text'>";
        echo "<a href='oferta.php?id={$result['id_oferta']}'><h3>{$result['denumire_locatie']} - {$result['tip_locatie']}</h3></a>";
        echo "<p>{$result['judet']}, {$result['localitate']}</p>";
        echo "</br>";
        echo "</br>";
        echo "<a href='oferta.php?id={$result['id_oferta']}'><p>Vizualizeaza</p></a>";
        echo "</div>";
        echo "</div>";

        if ($modulo < 1) 
        {
            echo "<div class='clear'></div>";
        }

    }

    echo "</div>";

这是while循环中div的CSS:

.clear
{
    clear:both;
}

.aranjare_text
{
    display: block;
    float: right;
    margin-right: 35%;
}

.border
{
    width: 47%;
    float:left;
}

你在那里看到的一切也包含在下面的div中:

#wrapper{width:1080px; margin:0 auto;}
.box_afisare
{
    margin-top: 5%;
    padding: 20px;
    border: 1px solid #333;
    box-shadow: 0px 0px 5px 2px #999999; 
    border-radius: 10px;
    background-color:white;
    height:100%
}

现在我们已经完成了代码,我想要的是显示h3和图像旁边的两个段落。事情是我想要的第一个查询结果,但其他查询结果没有正确安排。实际上这是一团糟。我想这可能是明显的错。这是我希望你提供帮助的地方。显示不均匀的no时我也有问题。查询,.box_afisare也不包含最后一个。谢谢,如果我需要在降级之前编辑我的帖子,请告诉我。我对这一切都不熟悉。

这是HTML生成的代码:

<div class='box_afisare'>           <div class="border">
            <!-- DE MODIFICAT LOCALHOST -->
            <img  src="http://localhost/design/photo/images/52042156c65d4/1-mini.jpg" id="poza"  />
            <div class='aranjare_text'><a href='oferta.php?id=52042156c65d4'><h3>Test - Club</h3></a><p>Bistrita-Nasaud, Oarecare</p></br></br><a href='oferta.php?id=52042156c65d4'><p>Vizualizeaza</p></a></div></div>            <div class="border">
            <!-- DE MODIFICAT LOCALHOST -->
            <img  src="http://localhost/design/photo/images/5205147a5f958/1-mini.jpg" id="poza"  />
            <div class='aranjare_text'><a href='oferta.php?id=5205147a5f958'><h3>test555555 - Restaurant</h3></a><p>Arges, grqw</p></br></br><a href='oferta.php?id=5205147a5f958'><p>Vizualizeaza</p></a></div></div><div class='clear'></div>         <div class="border">
            <!-- DE MODIFICAT LOCALHOST -->
            <img  src="http://localhost/design/photo/images/5205148d1aeb6/1-mini.jpg" id="poza"  />
            <div class='aranjare_text'><a href='oferta.php?id=5205148d1aeb6'><h3>test555555 - Restaurant</h3></a><p>Arges, grqw</p></br></br><a href='oferta.php?id=5205148d1aeb6'><p>Vizualizeaza</p></a></div></div>          <div class="border">
            <!-- DE MODIFICAT LOCALHOST -->
            <img  src="http://localhost/design/photo/images/5205326cf08ae/1-mini.jpg" id="poza"  />
            <div class='aranjare_text'><a href='oferta.php?id=5205326cf08ae'><h3>testnou - Restaurant</h3></a><p>Alba, vsfasf</p></br></br><a href='oferta.php?id=5205326cf08ae'><p>Vizualizeaza</p></a></div></div><div class='clear'></div>           <div class="border">
            <!-- DE MODIFICAT LOCALHOST -->
            <img  src="http://localhost/design/photo/images/5206337cd1cef/1-mini.jpg" id="poza"  />
            <div class='aranjare_text'><a href='oferta.php?id=5206337cd1cef'><h3>Test - Restaurant</h3></a><p>Alba, loc</p></br></br><a href='oferta.php?id=5206337cd1cef'><p>Vizualizeaza</p></a></div></div>          <div class="border">
            <!-- DE MODIFICAT LOCALHOST -->
            <img  src="http://localhost/design/photo/images/520777317270e/1-mini.jpg" id="poza"  />
            <div class='aranjare_text'><a href='oferta.php?id=520777317270e'><h3>sdasda - Restaurant</h3></a><p>Alba, dasdsadsa</p></br></br><a href='oferta.php?id=520777317270e'><p>Vizualizeaza</p></a></div></div><div class='clear'></div></div>

抱歉,但它没有格式化。

1 个答案:

答案 0 :(得分:0)

尝试将图像放在与文本相同的div中,就在文本之前,并将其赋予

<img align='left' src=...