如何分离引导卡

Question

我有一个模板，该模板使用引导程序4将存储在数据库中的数据列表显示为卡。问题是它显示卡堆叠在彼此上方 this is the problem

list.html

{% block body %}
<div class="container">
    <div class="row">
        {% for obj in object_list %}

            <div class="col-md-4 p-2">
                <div class="card bg-light text-right">
                    <div class="card-header">
                        <h2>hdhdh: {{ obj.suspect_name}} </h2>
                    </div>
                    <div class="card-body">
                        <h4 class="card-title"> fna :{{obj.suspect_father_name}}</h4>
                        <h6 class="card-subtitle mb-2">mna :{{obj.suspect_mother_name}}</h6>
                        <p class="card-text">{{obj.summary}}</p>
                        <a href={{obj.get_absolute_url}} class="btn btn-danger">details</a>
                        <a href="{% url 'update' obj.pk %}" class="btn btn-danger">edit</a>

                        {%include 'blog/delete.html' %}
                        <a href="{% url 'delete' obj.pk %}" class=" btn btn-danger confirm-delete" title="Delete" data-toggle="modal" data-target="#confirmDeleteModal" id="deleteButton{{obj.id}}">delete</a>

                </div>
            </div>
        </div>

    {% endfor %}
</div>