Question

我在我的网站上使用django-endless-pagination与twitter风格的分页和twitter bootstrap。

现在，使用django-endless-pagination，当显示第一页时，系统正在使用以下样式。

    .row-fluid .offset1:first-child {
        margin-left: 8.547008547008547%;
     }

但是从第二页开始，用于第一个元素的样式如下所示。

    .row-fluid .offset1 {
        margin-left: 11.11111111111111%;
     }

由于两个页面的第一个元素的页边距不同，因此第1页和第2页之间的行没有对齐。我如何更改它，以便第二页第一个元素也使用第一个子样式并且它是对齐的

编辑： -

我的代码在模板

中如下所示

    <div class="offset1 span10">

            <div class="span4">
                {% lazy_paginate column_1_items_list %}
                {% if column_1_items_list %}
                    {% for column_1_item in column_1_items_list %}
                        <div class="row-fluid image_div" style="padding-top:20px">
                            <h4 class="text-center"><a href="link">name_of_item</a></h4>
                             <a target="_blank" href="link_for_item">
                                <img class="item-size" src="photo.url" alt="name_of_item "/>
                            </a>
                            <p> quick_summary|safe </p>
                            <div class="row-fluid bottom">
                                <span class="price"><b>£ price</b></span>
                            </div>
                        </div>
                    {% endfor %}
                {% endif %}
                {% show_more " " %}
            </div>
      </div>

由于斯里卡特

Answer 1

你可以使用forloop.first并在你的CSS中添加一个类。

{% for column_1_item in column_1_items_list %}
    <div class="row-fluid image_div{% if forloop.first %} first_child{% endif %}" style="padding-top:20px">
    ...
{% endfor %}

django无尽的分页让第二页在bootstrap中使用不同的css

1 个答案: