Bootstrap网格内容位置

时间:2017-12-23 00:37:56

标签: django twitter-bootstrap-3 grid

我有以下django-oscar代码

    <ul class="row">
    {% for product in products %}
    <li class="col-xs-6 col-sm-4 col-md-3 col-lg-3">{% render_product product %}</li>
    {% endfor %}
</ul>
除了在电话上,它才能找到它。

从屏幕截图中可以看出,当电话尺寸缩小到手机时,网格系统中有一个奇怪的空间(它实际上在手机上显示如下)。在桌面上,网格系统正确显示,直到浏览器的大小小于某个px。有没有办法来解决这个问题? (我想我正在使用bootstrap3)

Grid system working well

Phone mode

2 个答案:

答案 0 :(得分:0)

您正在寻找的是clearfix

将此添加到父元素,在本例中为row

答案 1 :(得分:0)

如果仔细观察,在手机模式下,In Stock在不同的线路上,我认为这是一个高度问题。最佳解决方案是使用弹性框。或手动调整最小高度。