Help texts for login page overlap with error message

[enigmathix]

If you go to the login page and cause an error, like entering the wrong password or an invalid character, the error message overlaps the help texts:

The auth_views.LoginView.as_view method doesn't provide a way to pass help texts, so they have been added in the login template but their position doesn't take into account possible error messages.

A way to address this is to put these help texts inside the for loop on the form, so that they're always facing the input fields (note that the .six style overwrite also has to be removed here, and the paragraph tags were missing their closing tags):

puzzles/templates/login.html

{% extends "base.html" %}
{% block content %}

<style>
@media (min-width: 961px) {
    #login {
        position: relative;
    }
}
</style>

<h2>Login</h2>

<form id="login" method="post">
    {% csrf_token %}
    {{ form.non_field_errors }}

    <div class="form-section">
        {% for field in form %}
        <div class="row">
            <div class="two columns">
                {{ field.label_tag }}
            </div>
            <div class="four columns">
                {{ field }}
                {{ field.errors }}
            </div>
            {% if not hunt_is_closed %}
            <div class="six columns">
            {% if field.name == 'username' %}
                <p>If you haven&rsquo;t created a team yet, <a href="{% url 'register' %}">register a new team here</a></p>
            {% else %}
                <p>Forgot your password? <a href="{% url 'password_reset' %}">Click here to reset password</a></p>
            {% endif %}
            </div>
            {% endif %}
        </div>
        {% endfor %}
    </div>

    <div class="form-section">
        <button class="btn" type="submit">Submit</button>
    </div>
</form>

{% endblock %}

[cesium12]

Since you've already figured out a fix, would you mind putting it in a PR?