html - 验证摘要上方的间距从何而来，如何删除它？

Question

我有以下问题:

生成这个的代码来自 Bootstrap 模板，它看起来像这样:

@model LoginOrRegisterViewModel

@{
    ViewBag.Title = "Registreer je vandaag bij de Zaaikalender";
}

<!-- Fixed main screen -->
<div id="login" class="bg imglogin">

    <!-- Signup box inspired by http://bootsnipp.com/snippets/featured/login-amp-signup-forms-in-panel -->
    <div id="signupbox" style="padding: 3.5%; font-size: 12px;" class="mainbox span12">
        <div class="panel panel-info">
            <div class="panel-heading">
                <div style="float:right; font-size: 85%; position: relative; top:-10px">
                    <a id="signinlink" href="Login">Inloggen</a>
                </div>
            </div>  
            <div class="panel-body">

                @using (Html.BeginForm("Register", "Account", new { ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post, new { @class="form-horizontal", @role="form"}))
                {
                    @Html.AntiForgeryToken()

                    <div class="form-group">
                        @Html.ValidationSummary()  
                    </div>

                    <div class="form-group">
                        <div class="col-md-3" style="color: black;">
                            @Html.LabelFor(vm => vm.Register.FullName)
                        </div>
                        <div class="col-md-9">
                            @Html.TextBoxFor(vm => vm.Register.FullName, new { @class = "form-control", @placeholder = "Volledige naam", @AutoComplete ="off" } )
                        </div>
                    </div>

                    <div class="form-group">
                        <div class="col-md-3" style="color: black;">
                            @Html.LabelFor(vm => vm.Register.UserName)
                        </div>
                        <div class="col-md-9">
                            @Html.TextBoxFor(vm => vm.Register.UserName, new { @class = "form-control", @placeholder = "Gebruikersnaam", @Autocomplete = "off" } )
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-md-3" style="color: black;">
                            @Html.LabelFor(vm => vm.Register.Email)
                        </div>
                        <div class="col-md-9">
                            @Html.TextBoxFor(vm => vm.Register.Email, new { @class = "form-control", @placeholder = "E-mail ", @AutoComplete ="off"})
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-md-3" style="color: black;">
                            @Html.LabelFor(vm => vm.Register.Password)
                        </div>
                        <div class="col-md-9">
                            @Html.PasswordFor(vm => vm.Register.Password, new { @class = "form-control", @placeholder = "Wachtwoord", @AutoComplete ="off"})
                        </div>
                    </div>

                    <div class="form-group">
                        <!-- Button -->                                        
                        <div class="col-md-offset-3 col-md-9">
                            <button type="submit" class="btn btn-info"><i class="icon-hand-right"></i> &nbsp Registreer</button>
                        </div>
                    </div>

                }

             </div><!-- End panel body -->
        </div><!-- End panel -->
    </div><!-- End signup box -->

</div><!-- End main login div -->

上面的@Html.ValidationSummary()就是正文。间距在 form-group 类中，但其他对象没有，所以我怀疑它在验证摘要的 CSS 中。有谁知道吗？

Answer 1

删除 <ul> 的边距错误包装器的元素。

fiddle :http://jsfiddle.net/ah83Ln4L/

只需将其添加到您的 style.css 中:

.validation-summary-errors ul {
    margin-top: 0;
}