Hola, estoy intentando centrar el formulario de login de forma vertical y horizontal pero solo logro que se desarme, ayuda por favor.
Este es el formulario
<div class="site-login">
<h1><?= Html::encode($this->title) ?></h1>
<p>Por favor complete los siguientes campos para iniciar sesión:</p>
<?php $form = ActiveForm::begin([
'id' => 'login-form',
'layout' => 'horizontal',
'fieldConfig' => [
// 'template' => "{label}\n<div class=\"col-lg-3\">{input}</div>\n<div class=\"col-lg-8\">{error}</div>",
'template' => "{label}\n<div class=\"col-sm-12\">{input}</div>\n<div class=\"col-sm-12\">{error}</div>",
'labelOptions' => ['class' => 'col-sm-12 control-label'],
],
]); ?>
<?= $form->field($model, 'username')->textInput(['autofocus' => true]) ?>
<?= $form->field($model, 'password')->passwordInput() ?>
<?= $form->field($model, 'rememberMe')->checkbox([
'template' => "<div class=\"col-lg-offset-1 col-lg-3\">{input} {label}</div>\n<div class=\"col-lg-8\">{error}</div>",
]) ?>
<div style="color:#999;margin:1em 0">
Si olvidó su contraseña, puede <?= Html::a('restablecerla', ['site/request-password-reset']) ?>.
<br>
¿Necesita un nuevo correo electrónico de verificación? <?= Html::a('Reenviar', ['site/resend-verification-email']) ?>
</div>
<div class="form-group">
<div class="col-lg-offset-1 col-lg-11">
<?= Html::submitButton('Entrar', ['class' => 'btn btn-primary', 'name' => 'login-button']) ?>
</div>
</div>
<?php ActiveForm::end(); ?>
</div>
Y este es el css
.site-login {
width: 40%;
background-color: rgba(227, 188, 0, .5);
border: 1px solid rgba(0, 100, 214, .5);
position: absolute;
display: flex;
align-content: center;
justify-content: center; /* centra horizontal */
}