php - 使用 HTML 在 PHP 中对齐 3 个元素

Question

大家好，

我试图将元素排列成一行 3。在每一行的顶部都有一个名为“”的 div。这个 div 的目的是打开一个新的，每 3 个元素之后，div 必须关闭并打开另一个。我已经尝试了下面的代码，令我惊讶的是它不起作用。这很奇怪，因为 MOD 操作数应该可以工作。你们中有人看到我可能做错了什么吗？

写入图片应该是这样的它没有对齐，蓝色填满了整个页面。我不知道我做错了什么:

$currentRow = 1;
    echo '<div class="top-box">';
    while($Data=mysqli_fetch_array($Result))
        {

         echo '<div class="col_1_of_3 span_1_of_3"> 
           <a href="Single.php?Query='.$Data[5].'">
            <div class="inner_content clearfix">
                <div class="product_image">
                    <img src="images/'.$Data[14].'" height="300" width="320" alt=""/>
                </div>              
                <div class="price">
                   <div class="cart-left">
                        <p class="title">'.$Data[11].'</p>
                        <div class="price1">
                          <span class="actual">R'.$Data[13].'</span>
                        </div>
                    </div>
                    <div class="cart-right"> </div>
                    <div class="clear"></div>
                 </div>             
               </div>
             </a>
            </div>';

             $currentRow++;
             if($currentRow % 3 == 0)
             {
                    echo '</div>    ';
                    echo '<div class="top-box">';

             }
        }

当我像下面这样每 3 个元素手动重复这些元素时，它完美地工作:

    <div class="top-box">
      <div class="col_1_of_3 span_1_of_3">
         <a href="Single.php">
         <div class="inner_content clearfix">
            <div class="product_image">
                <img src="images/1st_Party_Boy.jpg" height="300" width="320" alt=""/>
            </div>
            <div class="price">
               <div class="cart-left">
                    <p class="title">His First Party</p>
                    <div class="price1">
                      <span class="actual">R350.00</span>
                    </div>
                </div>
                <div class="cart-right"> </div>
                <div class="clear"></div>
             </div>             
           </div>
           </a>
        </div>
        <div class="col_1_of_3 span_1_of_3">
            <a href="Single.php">
            <div class="inner_content clearfix">
            <div class="product_image">
                <img src="images/Her_First_Party.jpg" height="300" width="320" alt=""/>
            </div>
             <div class="sale-box"><span class="on_sale title_shop">New</span></div>
            <div class="price">
               <div class="cart-left">
                    <p class="title">Her First of Many </p>
                    <div class="price1">
                      <span class="actual">R350.00</span>
                    </div>
                </div>
                <div class="cart-right"> </div>
                <div class="clear"></div>
             </div>             
           </div>
           </a>
        </div>
        <div class="col_1_of_3 span_1_of_3">
         <a href="Single.php">
         <div class="inner_content clearfix">
            <div class="product_image">
                <img src="images/First_one_for_boys_and_girls.jpg" height="300" width="320" alt=""/>
            </div>
            <div class="price">
               <div class="cart-left">
                    <p class="title">Their First Birthday</p>
                    <div class="price1">
                      <span class="actual">R350.00</span>
                    </div>
                </div>
                <div class="cart-right"> </div>
                <div class="clear"></div>
             </div>             
           </div>
         </a>
        </div>
        <div class="clear"></div>
    </div>  

Answer 1

嘿，将 $currentRow 更改为零

$currentRow = 0;
    echo '<div class="top-box">';
    while($Data=mysqli_fetch_array($Result))
        {

         echo '<div class="col_1_of_3 span_1_of_3"> 
           <a href="Single.php?Query='.$Data[5].'">
            <div class="inner_content clearfix">
                <div class="product_image">
                    <img src="images/'.$Data[14].'" height="300" width="320" alt=""/>
                </div>              
                <div class="price">
                   <div class="cart-left">
                        <p class="title">'.$Data[11].'</p>
                        <div class="price1">
                          <span class="actual">R'.$Data[13].'</span>
                        </div>
                    </div>
                    <div class="cart-right"> </div>
                    <div class="clear"></div>
                 </div>             
               </div>
             </a>
            </div>';

             $currentRow++;
             if($currentRow % 3 == 0)
             {
                    echo '</div>    ';
                    echo '<div class="top-box">';

             }
        }