怎么让这些元素放进一个块里然后居中显示？

这是显示的效果

关于这一部分的代码

    {% if job_list %}

        {% for job in job_list %}
            <div class="card" style="">
                <div class="card-body">
                    <p style="font-family:微软雅黑;color:black" class="card-title">公司名称：{{ job.company }}</p>
                </div>
                <p style="font-family:微软雅黑;color:black" class="card-title">岗位名称：{{ job.jobname }}</p>
                <p style="font-family:微软雅黑;color:black" class="card-title">岗位职责：{{ job.jobduty }}</p>
                <p style="font-family:微软雅黑;color:black" class="card-title">岗位要求：{{ job.jobdemand }}</p>
            </div>
        {% endfor %}

.card {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}