How can i fix my ui in django jinja template everything is messed up?

i was adding image sharing functionality to my project but now i messed up its ui and i am unable to fix it!!

<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>

the above code has "message_form.body" has a text area without id so it a name="body" and the code "message_form.image" is the image upload button.

i don't know what went wrong but the text area and button are hard stuck and send message button is expanded. i attached the image or the ui pls help.

i just want to adjust text area and the upload and send message button

this is my site at 100% scale

this is at 33% scale

the website is working properly just the UI is messed up need help to fix it

Back to Top