【发布时间】：2015-05-04 21:10:42
【问题描述】：
我正在尝试将我的 mysql 结果显示为水平图块，一旦它到达屏幕的末尾就会“自动换行”。现在它在垂直列中显示所有结果。
如何将结果显示为平铺/网格？
<?php while ($r = $q->fetch()): ?>
<div class="tab-content clear">
<div role="tabpanel" class="tab-pane active" id="home">
<div class="col-sm-4 col-xs-4 section1a">
<div class="sectionstyle">
<div class="textcenter">
<h2> <?php echo $r['Name'] ?></h2>
<p>description goes here</p>
</div>
<div class="">
<img class="img-responsive" src="images/image.jpg">
</div>
<div class="clear"></div>
<p><small>bar A</small>
</p>
<div class="progress">
<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%">
<span class="sr-only">40% Complete (success)</span>
</div>
</div>
<p><small>bar B</small>
</p>
<div class="progress">
<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%">
<span class="sr-only">20% Complete</span>
</div>
</div>
<p><small>bar C</small>
</p>
<div class="progress">
<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%">
<span class="sr-only">60% Complete (warning)</span>
</div>
</div>
<p><a class="btn btn-success btn-primary btn-block buttoncenter" href="#" role="button">Submit</a>
</p>
</div>
</div>
</div></div>
<?php endwhile; ?>
【问题讨论】：
-
这是一个 PHP 或 MySQL 的问题？
-
我认为我必须更改我的 php 以不同方式显示结果。对不起，如果我错了，我对 PHP 世界很陌生。添加了更多相关标签。
-
查看 CSS，然后查看 'float'：w3schools.com/cssref/pr_class_float.asp，但您也可以使用 display:inline-block。
-
查看这个关于使用 css 水平对齐 div 的问题：stackoverflow.com/questions/37103/…