位于部分内部的中心部分

Question

有人可以帮助CSS新手吗？我有一个主要部分，然后在其中有一个部分。我需要将第二部分置于主要部分的中心位置。你怎么能这样做？这是我的代码。

.section1 {
    border: 1px solid #CCCCCC;
    padding: 10px;
    overflow: hidden;
    margin-left: auto;
    margin-right: auto;
}
.section2 {
    padding:10px; overflow:hidden;
    margin-left: auto;margin-right: auto;
}

<section class="section1">
        <section class="section2">
            <div>
                Registration Status
                @Html.TextBoxFor(model => model.RegSts, new { disabled = true, size="10" })
                Admitting Program
                @Html.TextBoxFor(model => model.AdmProg, new { disabled = true, size="10" })
                Academic Location
                @Html.TextBoxFor(model => model.Loc, new { disabled = true, size="10" })
                Division
                @Html.TextBoxFor(model => model.Div, new { disabled = true, size="10" })
            </div>
        </section>
    </section>