Почему мои элементы div и формы выталкиваются за пределы таблицы?

Код шаблона Django:

Включает jQuery и Bootstrap; рендерится через обычную функцию Django render и передается список моделей файлов и опций профиля.

{% extends 'client/header.html' %}

{% block content %}
<div class="container-fluid">
    <div class="row">
        <div class="col">
            <div class="row">
                <div class="col">
                    <div class="table-responsive">
                        <table class="table">
                            <tbody>
                                {% for file in Files %}
                                <tr>
                                    <div id="file{{ file.id }}">
                                        <form method="POST">
                                            <input name="fileid" type="hidden" value="{{ file.id }}" required />
                                            <td>
                                                <input name="filename" type="text" value="{{ file.getFriendlyName }}" required />
                                            </td>
                                            <td>
                                                <select style="width: 236px;" name="profileChoice" required>
                                                    {% for profile in Profiles %}
                                                        <option value="{{ profile.id }}" {% ifequal profile.id file.profile.id %}selected{% endifequal %}>{{ profile.label }}</option>
                                                    {% endfor %}
                                                </select>
                                            </td>
                                            <td>
                                                {{ file.date_updated }}
                                            </td>
                                            <td>
                                                <button type="button" class="btn btn-primary" value="saveChanges" onclick="formThing(this);">Save</button>
                                                <a type="button" class="btn btn-danger" href="#" onclick="if(confirm('Are you sure?')){fetch('/files/removeFile/{{file.id}}');} location.href = '/companyadmin/fileManager';">Remove</a>
                                            </td>

                                        </form>
                                    </div>
                                </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}

Элемент инспекции хрома: enter image description here

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