HTML: Align checkboxes in the left under the textboxes

Question

Description image

I'd like to align my checkboxes in the left, under the textboxes. I just can't fix it, I don't know where is the problem exactly, maybe my columns, or my form-group. Please check out the code:

<div class="">
    <div class="row">
        <div class="form-group">
            <div class="col-sm-12">
                <h1 style="text-align:center">Firma Noua</h1>
            </div>
        </div>
    </div>
    <br />
    <div class="row">
        <div class="form-group col-sm-6">
            <div class="row">
                <div class="form-group">
                    <div class="col-sm-5" style="text-align:center; padding-top:10px">
                        @Html.LabelFor(model => model.Nume)
                    </div>
                    <div class="col-sm-6">
                        @Html.TextBoxFor(model => model.Nume, new { @class = "form-control" })
                        @Html.ValidationMessageFor(model => model.Nume)
                    </div>
                </div>
            </div>
            <br />

            <div class="row">
                <div class="form-group">
                    <div class="col-sm-5" style="text-align:center; padding-top:10px">
                        @Html.LabelFor(model => model.Cod_Fiscal, "Cod Fiscal")
                    </div>
                    <div class="col-sm-6">
                        @Html.TextBoxFor(model => model.Cod_Fiscal, new { @class = "form-control" })
                        @Html.ValidationMessageFor(model => model.Cod_Fiscal)
                    </div>
                </div>
            </div>

            <br />

            <div class="row">
                <div class="form-group">
                    <div class="col-sm-5" style="text-align:center">
                        @Html.LabelFor(model => model.Email)
                    </div>
                    <div class="col-sm-6">
                        @Html.TextBoxFor(model => model.Email, new { @class = "form-control" })
                        @Html.ValidationMessageFor(model => model.Email)
                    </div>
                </div>
            </div>

            <br />

            <div class="row">
                <div class="form-group">
                    <div class="col-sm-5" style="text-align:center">
                        @Html.LabelFor(model => model.Adresa)
                    </div>
                    <div class="col-sm-6">
                        @Html.TextAreaFor(model => model.Adresa, new { @row = 4, @class = "form-control" })
                        @Html.ValidationMessageFor(model => model.Adresa)
                    </div>
                </div>
            </div>

            <br />

            <div class="row">
                <div class="form-group">
                    <div class="col-sm-5" style="text-align:center">
                        @Html.LabelFor(model => model.Client)
                    </div>
                    <div class="col-sm-6" style="text-align:center">
                        @Html.CheckBoxFor(m => m.Client, new { @class = "form-control" })
                        @Html.ValidationMessageFor(m => m.Client)
                    </div>
                </div>
            </div>
            <br />
            <div class="row">
                <div class="form-group">
                    <div class="col-sm-5" style="text-align:center">
                        @Html.LabelFor(model => model.Furnizor)
                    </div>
                    <div class="col-sm-6" style="text-align:center">
                        @Html.CheckBoxFor(m => m.Furnizor, new { @class = "form-control" })
                        @Html.ValidationMessageFor(model => model.Furnizor)
                    </div>
                </div>
            </div>
        </div>

        <div class="form-group col-sm-6">
            <div class="row">
                <div class="form-group">
                    <div class="col-sm-5" style="text-align:center">
                        @Html.LabelFor(model => model.Denumire)
                    </div>
                    <div class="col-sm-6" style="text-align:center">
                        @Html.TextBoxFor(model => model.Denumire, new { @class = "form-control" })
                        @Html.ValidationMessageFor(model => model.Denumire)
                    </div>
                </div>
            </div>

            <br />

            <div class="row">
                <div class="form-group">
                    <div class="col-sm-5" style="text-align:center">
                        @Html.LabelFor(model => model.Nr_Registru_Comert, "Numar Registrul Comertului")
                    </div>
                    <div class="col-sm-6" style="text-align:center">
                        @Html.TextBoxFor(model => model.Nr_Registru_Comert, new { @class = "form-control" })
                        @Html.ValidationMessageFor(model => model.Nr_Registru_Comert)
                    </div>
                </div>
            </div>

            <br />
            <div class="row">
                <div class="form-group">
                    <div class="col-sm-5" style="text-align:center">
                        @Html.LabelFor(model => model.Telefon)
                    </div>
                    <div class="col-sm-6" style="text-align:center">
                        @Html.TextBoxFor(model => model.Telefon, new { @class = "form-control" })
                        @Html.ValidationMessageFor(model => model.Telefon)
                    </div>
                </div>
            </div>

            <br />

            <div class="row">
                <div class="form-group">
                    <div class="col-sm-5" style="text-align:center">
                        @Html.Label("Localitate")
                    </div>
                    <div class="col-sm-6" style="text-align:center">
                        @Html.Action("JudeteLocalitatiComboBox", "Cataloage")
                    </div>
                </div>
            </div>

            <br />

            <div class="row">
                <div class="form-group">
                    <div class="col-sm-5" style="text-align:center">
                        @Html.Label("Tip Servicii")
                    </div>
                    <div class="col-sm-6" style="text-align:left">
                        @Html.Action("TipServicii", "Cataloage")
                    </div>
                </div>
            </div>
        </div>
    </div>

    <br />
    <div class="row">
        <div class="form-group">
            <div class="col-sm-6">
                <button type="submit" class="btn btn-primary full-width m-b" onclick="OnClick();">Create</button>
            </div>
            <div class="col-sm-6">
                <button type="button" class="btn btn-primary full-width m-b" onclick="CloseCreateUser();">Close</button>
            </div>
        </div>
    </div>
</div>

Answer 1

请使用text-align =“ center”删除所有内联css，并且您可以使用bootstrap类text-left。