如何避免网格中出现空单元格？

Question

请看屏幕：

谁能告诉我，如何避免网格中出现这样的空单元格？ Foundation 中是否有任何内置功能，或者我是否需要编辑 css?

代码：

{% extends 'main.html' %}
{% load staticfiles %}

{% block show %}

    <div class="row large-collapse">
        <div class="large-12 columns">

            {% for show in shows %}

                <div class="large-4 columns">
                    <div class="panel">
                        <h4><a href="/shows/get/{{ show.id }}">{{ show.show_name }}</a></h4>
                        <img src="{% static 'app_shows_and_times/images/poster.jpg' %}" width=200>
                        <h6>Genre: {{ show.show_genre }}</h6>
                        <h6>Length: {{ show.show_length }}</h6>
                        <h6>Origin: {{ show.show_origin_country }}</h6>
                    </div>
                </div>

            {% endfor %}

        </div>
    </div>

{% endblock %}

这是 Django 的模板，所以我不确定在这种情况下是否有必要使用 fiddle。

Answer 1

可能是因为你的列加起来不是12。修改它们，你可能需要检查Foundation's block-grid

旁注，最好post你的HTML代码，甚至更好fiddle

如何避免网格中出现空单元格？

How to avoid empty cells in a grid?

django

zurb-foundation

zurb-foundation-5