колба питона: как выровнять форму по центру

Question

Привет, я хочу поместить форму входа в login.html, созданный файлом 'bootstrap / wtf.html.Но форма имени пользователя и пароль выровнены по левому краю, как показано на следующем рисунке.Я хочу поместить форму в центре.

Код следующий:

    {% extends "common/base.html" %}

{% import 'bootstrap/wtf.html' as wtf %}
{#{% import "macros/_patination.html" as page_macros %}#}

{#<link rel="stylesheet" href="/static/style.css" type="text/css">#}

{% block content %}
<div class = "main-login">

    <h1>{{ _('Sign In') }}</h1>
    <div class="main-form">
        <div class="col-md-4">
            {{ wtf.quick_form(form) }}
        </div>
    </div>
    <br>
    <p>{{ _('New User?') }} <a href="{{ url_for('auth.register') }}">{{ _('Click to Register!') }}</a></p>
    <p>
        {{ _('Forgot Your Password?') }}
        <a href="{{ url_for('auth.reset_password_request') }}">{{ _('Click to Reset It') }}</a>
    </p>
</div>      

и код в стиле CSS:

.main-login{
  padding-top: 100px;
  text-align: center;
}
.main-form{
  /*padding-top: 100px;*/
  text-align: center;
  /*display: inline-block;*/
}

Answer 1

Все, что вам нужно сделать, это изменить раздел кода:

<div class="col-md-4">
        {{ wtf.quick_form(form) }}
</div>

на

<div class="col-md-4 col-lg-offset-4">
        {{ wtf.quick_form(form) }}
</div>

И вам должно быть хорошо.