欢迎论坛居民，
我的目标是在输入卡中显示MySQL数据，并在引导4行中并排对齐的卡。
读取MySQL数据可以正常工作，但是Bootstrap 4网格系统不会将输入卡并置。 （如果我不从MySQL读取数据，则仅使用纯HTML，Grid系统可以正常工作。）
代码：
...
<?php include_once('includes/head.tpl'); ?>
</head>
<body>
<?php include_once('includes/php/navbar.php'); ?>
<form method="GET" action="action2.php">
<?php
$result = mysqli_query($conn, "SELECT * FROM plans");
while($row = mysqli_fetch_array($result)) {
?>
<div class="container">
<div class="row">
<div class="col-sm-4">
<label>
<input type="radio" name="plan_id" id="plan_id" value="<?php echo $row['id']; ?>" class="card-input-element" />
<div class="card-input">
<?php echo $row['plan_name']; ?><br>
<?php echo $row['plan_cpu']; ?><br>
<?php echo $row['plan_memory']; ?><br>
<?php echo $row['plan_disk']; ?><br>
</div>
</label>
</div>
</div>
<?php
}
?>
<input type="submit" name="btn-submit">
</form>
</div>
...
最终结果：
可能是什么问题呢？
为什么在阅读MySQL时网格系统无法正常工作？
预先感谢您的回答！
最佳答案
问题看起来就像您为数据的每一行创建了引导容器div和row元素，这应该在您检索行的循环之外...
<div class="container">
<div class="row">
<?php
$result = mysqli_query($conn, "SELECT * FROM plans");
while($row = mysqli_fetch_array($result)) {
?>
<div class="col-sm-4">
<label>
<input type="radio" name="plan_id" id="plan_id" value="<?php echo $row['id']; ?>" class="card-input-element" />
<div class="card-input">
<?php echo $row['plan_name']; ?><br>
<?php echo $row['plan_cpu']; ?><br>
<?php echo $row['plan_memory']; ?><br>
<?php echo $row['plan_disk']; ?><br>
</div>
</label>
</div>
<?php
}
?>
</div>
</div>
如果您有更多适合行的计划，则每次到达拆分点时，都需要为该行创建div。
关于php - 将MySQL数据读入Bootstrap 4列，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/58778205/