Блог

login.html файл:

 {% extends "base.html" %}
{% block content %}
<div class="container login-page-form">
    <form id="login-form" action="/auth/login" method="post">
        <div class="form-group">
            <label for="Email">Email Address</label>
            <input type="text" id="email" class="form-control" name="email">
        </div>
        <div class="form-group">
            <label for="password">Password</label>
        <input type="password" id="password" class="form-control"  name="password">
        </div>
        <button type="submit" class="btn btn-primary">Submit</button>
    </form>
</div>
{% endblock %}
  

файл main.css:

 #login-form {
    margin-top: 25px
}

.login-page-form {
    max-width: 200px;
}
  

Я прикрепил код как для html, так и для CSS-файла.
Я использую bootstrap для создания своей html-страницы и хочу добавить некоторые из моих собственных свойств CSS для формы как max-width.

Выберите элементы и используйте !важно переопределить Bootstrap CSS.

 #login-form {
    margin-top: 25px !important;
}

.login-page-form {
    max-width: 200px !important;
}