MVC 视图列的起始高度不同

Question

使用 MVC 5 和 bootstrap。我有一个包含两行的视图。顶行有两列。为什么当页面完成时右栏似乎开始时比左栏低一点？此外，第二行（底部）不如第一行（顶部）宽。我试过制作自定义类，我试过向 div 标签添加和删除各种属性，但问题仍然存在。

代码如下。任何帮助将不胜感激。

@model MVCConv.Models.House


<div class="row">
    <div class="col-md-12">
        <h3>@Html.DisplayFor(model => model.Name)</h3>
    </div>
</div>

@{
    var pageDescription = Model.Page_Description.ToString();
    var isHtmlDescrption = Model.isHTML;
}

<div class="row">

    <div class="col-md-2 container-fluid full-width">
        <div class="MyCustomClass">Contact Info</div>

        <dl class="dl-horizontalus">
            <dt>
                @Html.DisplayNameFor(model => model.Name)
            </dt>

            <dd>
                @Html.DisplayFor(model => model.Name)
            </dd>

            <dt>
                Site URL:
            </dt>

            <dd>
                @Html.DisplayFor(model => model.Site_URL)
            </dd>

            <dt>
                Contcat Name:
            </dt>

            <dd>
                @Html.DisplayFor(model => model.Contact_Name)
            </dd>

            <dt>
                Email Address:
            </dt>

            <dd>
                @Html.DisplayFor(model => model.Contact_Email)
            </dd>

            <dt>
                Contact Phone:
            </dt>

            <dd>
                @Html.DisplayFor(model => model.Contact_Phone)
            </dd>
        </dl>

        <div class="MyCustomClass">Special Offers</div>
        <div class="whiteCellus">@Html.DisplayFor(model => model.Special)</div>

    </div>

    <div class="col-md-10 panel-body container-fluid full-width">
        <div class="MyCustomClass">About the House</div>

        @if (Convert.ToBoolean(isHtmlDescrption))
        {@Html.Raw(pageDescription)}
        else
        {@Html.Raw(pageDescription.Replace(Environment.NewLine, "<br/>"))}

    </div>
</div>

<hr />

<div class="col-md-12 container-fluid full-width">
    <div class="MyCustomClass">History</div>
    @{
        using (var context = new MVCConv.Models.Houses())
        {
            var record = context.ImportedSP(Model.HouseID).ToList();
            @Html.Partial("_PartialPage", record
        }
    }
        </div>

Answer 1

在拆开页面并反复试验但删除 div 以找出导致列不均匀的 div 后...

Panel-body是问题的根源。当我删除它时，列与顶部对齐，所有行也对齐并占用整个屏幕宽度。

MVC 视图列的起始高度不同

MVC View columns do not start at same height

asp.net-mvc

twitter-bootstrap

asp.net-mvc-views