0

我使用引导程序创建了以下卡片布局(如屏幕截图所示)。班级正在垂直添加我的.card-columns卡片,因此我丢失了卡片的一部分。

我希望我的卡片水平对齐,每行正好 3 张卡片,而不改变卡片的大小。

这是我的标记和代码:

<body>
  <div class="card-columns">
  <?php
      $conn=new mysqli("localhost","root","","dbname");
          if(!$conn)
          {
            echo "connection_failed";
          }
          else{

          }
          $query= "select title,description,id from problems where difficulty='hard'";
          $result=mysqli_query($conn,$query);
          $num=mysqli_num_rows($result);
          if(mysqli_query($conn,$query)){

          }
          else{
        echo "Error: " . $query . "<br>" . mysqli_error($conn);
      }
        ?>

<?php 
  while ($row=mysqli_fetch_array($result)) { 
    $title=$row[0];
    $description=$row[1];
    $index=$row[2];
    ?>
    <div class="card-group">
  <div class="card bg-info">
    <div class="card-body">
      <h5 class="card-title" style="color:white;">Card title</h5>
      <p class="card-text" style="color: white;">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
      <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
    </div>
  </div>
</div>
</body>
<?php }?>

4

0 回答 0