css引导计算列数

lrl1mhuk  于 2021-06-18  发布在  Mysql
关注(0)|答案(1)|浏览(255)

我正在重新设计我的网站,我想在一个表中显示4行的记录,不管它需要多少行。
我有一个剧本,我已经玩了好几个小时,但我没有得到想要的结果。实际上,它只是一行接一行地列出。

<div class="row">
<div class="col-3 col-12-medium">

<?php 
$finditems="Coffee Mugs - Ceramic";
$servername = '';
$username   = '';
$password   = '';
$dbname     = '';
$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}$sql = "SELECT * FROM inventory WHERE product_subcategory LIKE '$finditems' 
AND(product_active='Y' OR product_active='C' OR product_active='O') AND 
web_sale<>'N' ORDER BY product_name ASC";
$result = $conn->query($sql);

if ($result->num_rows > 0) {

while($row = $result->fetch_assoc()) {
    echo "<div class=''col-3 col-12-medium'>". $row["product_name"]. "  " . 
$row["product_code"]. " $" . $row["product_p1"]. "<br><img 
src='products/".$row['product_code'].".jpg' width='100' height='100'> 
</div>";
    }
} else {
echo "0 results";
}
?>
</div><div>

一些结果可能只找到2个项目,其他可能会显示10个(取决于搜索词)。所以当有多个时,它会在右边显示下一个项目,直到第4行被填满,然后它会转到下一行。我知道我遗漏了一些东西来计算,但我就是找不到。
谢谢你的帮助。

ivqmmu1c

ivqmmu1c1#

对于中等屏幕设备,它应该是

<div class="col-md-3">....</div>

把这个包含在你想在一列中列出的所有div中。你们中有谁想加上这个

<div class="col-sm-1 col-md-3 col-lg-4">....</div>

根据需要更改号码。

相关问题