Having some difficulty centering the content on my login page. Can you assist with styling? I would like to have the input fields centralized and compact, similar to a standard login page. Also, I am encountering an issue with using different Bootstrap versions for various components in my project. Is there a workaround for this?
Here is the code snippet:
{% extends "auctions/layout.html" %}
{% block body %}
<h2>Login</h2>
{% if message %}
<div>{{ message }}</div>
{% endif %}
<form action="{% url 'login' %}" method="post">
{% csrf_token %}
<div class="form-group">
<input autofocus class="form-control" type="text" name="username" placeholder="Username">
</div>
<div class="form-group">
<input class="form-control" type="password" name="password" placeholder="Password">
</div>
<input class="btn btn-primary" type="submit" value="Login">
</form>
Don't have an account? <a href="{% url 'register' %}">Register here.</a>
{% endblock %}