【发布时间】:2018-12-02 11:09:00
【问题描述】:
所以我遇到的问题是,当我生成卡片来填充我的卡片列 div 时:
while($row = $categorias->fetch_assoc()) {
$imagen = $row["Imagen"];
$categoria = $row["Categoria"];
echo "<div class='card'>";
echo "<img class='card-img-top' src='./img/$imagen' alt='$categoria'>";
echo "<div class='card-body'>";
echo "<form action='go.php' method='post'>";
echo "<h5 class='card-title'>$categoria</h5>";
echo "<input type='hidden' name='producto' id='hiddenField' value='$categoria'>";
echo "<input class='btn' type='submit' value='ver más'>";
echo "</form>";
echo "</div>";
echo "</div>";
}
它将它们倒置而不是从左到右排列,我用于卡片列的 css:
/*col-sm*/
@media (min-width: 576px) {
.card-columns {
column-count: 2;
}
}
/*col-md*/
@media (min-width: 768px) {
.card-columns {
column-count: 2;
}
}
/*col-lg*/
@media (min-width: 992px) {
.card-columns {
column-count: 3;
}
}
/*col-xl*/
@media (min-width: 1200px) {
.card-columns {
column-count: 4;
}
}
不得不说,我在css方面做得很差,我还是不习惯。
【问题讨论】:
-
请您发布您在浏览器中绘制的编译html
-
@NanditaAroraSharma 我不知道这是否是您要求的,但我希望它有助于解决问题
-
我不熟悉 php,但我仍然尝试使用它和原始 html/css 来回答您的问题。如果它适合你,请尝试
标签: php html css bootstrap-4