Как поставить @ html .editorfor в центр?

Question

Я собираюсь сделать страницу редактирования, которая обновляет байки. Я использовал bootstrap для html дизайна, но похоже, что он больше не работает правильно. Вот мои коды;

 @model Avent.Entity.Bike

@{
    ViewBag.Title = "Edit";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Edit Bike @Model.Brand @Model.BikeModel</h2>

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()
    
<div class="form-horizontal col-12 text-center">
    <h4>Bike</h4>
    <hr />
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    @Html.HiddenFor(model => model.Id)
    <img class="img-thumbnail" src="@Model.Image" />
    <div class="form-group text-center">
        @Html.LabelFor(model => model.CreationDate, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-6 text-center">
            @Html.EditorFor(model => model.CreationDate, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.CreationDate, "", new { @class = "text-danger" })
        </div>
    </div>

Я пробовал все, что могу, но ярлыки помещают центр, а текстовые поля - нет. :( Не могли бы вы мне помочь?

Answer 1

Вы можете использовать классы '.justify-content-center' или '.offset-md-3' из системы сетки Bootstrap.

Вот пример кода . https://www.codeply.com/p/CH1zSO7u6j