应用样式时，modelformset不起作用，如何在formset中显示图像

如何解决应用样式时，modelformset不起作用，如何在formset中显示图像

我正在尝试在模型“ Offer”上定义一个modelformset_factory 当我的表单字段未包装在div中时，它们工作正常（创建和删除表单）。一旦将它们包装在div中，功能就无法正常工作。

我也想在modelformset_factory内部显示图像

这是我的视图函数和html

def offers(request):
    OfferFormSet = modelformset_factory(Offer,fields=('name','url','image','active'),can_delete=True)
    formset = OfferFormSet()

    if request.method == 'POST':
        formset = OfferFormSet(request.POST,request.FILES)
        if formset.is_valid():
            instances = formset.save(commit=False)
            for instance in instances:
                instance.save()
            for instance in formset.deleted_objects:
                instance.delete()
                return  redirect('.')
    formset = OfferFormSet()
    context = {'formset': formset}
    return render(request,'offers.html',context)

HTML在这里：

{% extends 'base.html' %}
{% block content %}
    <style media="screen">
        .form_div {
            padding: 20px 40px;
            margin: 20px;
            display: flex;
            flex-direction:row;
            flex-grow: 1;
            align-items: center;
            justify-content: space-between;
            background: #eee;
            border-radius: 2%;
            Box-shadow: 0 0 10px 10px rgba(0,0.1);
        }
        .form_grp{
            display: flex;
            flex-direction: column;
        }
    </style>

    <div class="container">
        <div class="formset">
            <form method="post" enctype="multipart/form-data" class="forms">
                {% csrf_token %}
                {{ formset.management_form }}
                {% for form in formset %}
                    <div class="form_div">
                        <div class="form_grp">
                            <label for="">{{ form.name.label_tag }}</label>
                            {{ form.name }}
                        </div>
                        <div class="form_grp">
                            <label for="">{{ form.url.label_tag }}</label>
                            {{ form.url }}
                        </div>
                        <div class="form_grp">
                            <label for="">{{ form.image.label_tag }}</label>
                            {{ form.image }}
                        </div>
                        <div class="form_grp">
                            <label for="">{{ form.active.label_tag }}</label>
                            {{ form.active }}
                        </div>
                        <div class="form_grp">
                            <label for="">{{ form.DELETE.label_tag }}</label>
                            {{ form.DELETE }}
                        </div>
                        <input type="submit" value="Create" class="btn btn-primary btn-sm">
                    </div>
                {% endfor %}
            </form>
        </div>
    </div>
{% endblock content %}

为什么会这样？任何想法？ 提前谢谢你