python flask：如何在中心对齐表单

Question

您好我想将登录表单放在由bootstrap / wtf.html创建的login.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>

你应该很好。