Я хочу центрировать следующие элементы div в середине экрана ГОРИЗОНТАЛЬНО И ВЕРТИКАЛЬНО (2 САЙТА). Что я должен добавить в свой HTML-код, чтобы он работал? Мне удалось центрировать div с первого сайта по вертикали, добавив класс justify-content-center ко второму div, но то же самое не работает для второго сайта.
первый сайт
<div class="container">
<div class="row justify-content-center">
<div class="form-group col-md-4">
<form method="post" th:object="${redirectionDto}">
<div class="form-group">
<label for="urlinput">URL</label>
<input type="text" id="urlinput" class="form-control" th:field="*{url}" name="urlinput"
maxlength="255"/>
</div>
<div class="form-group">
<label for="date">Date:</label>
<div class="input-group date" id="datetimepicker1" data-target-input="nearest">
<input type="text" class="form-control datetimepicker-input" data-target="#datetimepicker1"
th:field="*{expireDate}" id="date" placeholder="Date"/>
<div class="input-group-append" data-target="#datetimepicker1" data-toggle="datetimepicker">
<div class="input-group-text"><i class="fa fa-calendar-alt"></i></div>
</div>
</div>
</div>
<button class="btn btn-primary" type="submit">Submit form</button>
</form>
</div>
</div>
</div>
второй сайт
<div class="container">
<label>Short link: </label>
<p th:text="${redirectionDto.alias}"></p>
<label>Expire date: </label>
<p th:text="${#dates.format(redirectionDto.expireDate, 'dd/MM/yyyy h:mm a')}"></p>
<a th:href="@{/}" class="btn btn-primary">Return</a>
</div>
