Как исправить ui в шаблоне django jinja все перепутано?

я добавлял функцию обмена изображениями в свой проект, но теперь я испортил его ui и не могу исправить это!!!

<div class="room__message">
            <form method="POST" enctype="multipart/form-data">
                {% csrf_token %}
                <div class="mb-3">
                    {{ message_form.body }}
                </div>
                <div class="mb-3">
                    {{ message_form.image }}
                </div>
                <input type="submit" class="btn btn-primary" value="Send Message">
            </form>
        </div>

В приведенном выше коде "message_form.body" есть текстовая область без id, поэтому она name="body" а код "message_form.image" - это кнопка загрузки изображения.

я не знаю, что пошло не так, но текстовая область и кнопка жестко застряли, а кнопка отправки сообщения развернута. я прикрепил изображение или ui pls help.

я просто хочу настроить текстовую область и кнопку загрузки и отправки сообщения

это мой сайт в 100% масштабе

это в масштабе 33%

сайт работает правильно только пользовательский интерфейс испорчен нужна помощь чтобы исправить это

Вернуться на верх