ASP .net MVC5 - CSS 样式问题 - “@Html.ValidationMessageFor”答案

【问题标题】：ASP .net MVC5 - CSS styling issue- "@Html.ValidationMessageFor"ASP .net MVC5 - CSS 样式问题 - “@Html.ValidationMessageFor”
【发布时间】：2014-05-13 03:56:19
【问题描述】：

我的问题是设置服务器生成的验证消息的样式，填充在消息生成之前显示背景颜色，当填充被删除时，背景颜色不再可见。

我想在代码中添加填充以用于样式设置，但不显示任何内容或背景颜色，因为这是一条验证消息，代码如下：

<div class="validate">@Html.ValidationMessageFor(m => m.Email)</div>

css:

.validate {color:#ecf0f1;font-size:.9em;background-color:#e74c3c;padding:10px;}

验证前：

验证出现后会发生什么：

验证前我想要什么：

【问题讨论】：

在 site.css 中将 .field-validation-error 更改为您需要的样式。您不需要创建新类。这样做你就不用担心你的问题了
好的，谢谢你，我这样做了，但现在背景颜色没有跨越整个 div，如屏幕截图所示。
添加了一个演示小提琴供您参考。如果仍然无法正常工作，请分享您的代码呈现的 HTML！

标签： c# html asp.net css asp.net-mvc-5

【解决方案1】：

这是因为 Div 你在里面有 ValidationMessage 并且 CSS 应用在那个 div 上。

试试这个 CSS：

.validate:not(:empty)
 {
   color:#ecf0f1;
   font-size:.9em;
   background-color:#e74c3c;
   padding:10px;
 }

DEMO FIDDLE

【讨论】：

:not :empty，视觉上没有做任何事情，是不是缺少了什么？
哎呀...请注意：它是 :not(:empty) 而不是 :not :empty

【解决方案2】：

通过修改类解决：

.field-validation-error

通过添加：

{display: inline-block;  width:100%;
color:#ecf0f1;
font-size:.9em;
background-color:#e74c3c;
padding:10px;}

【讨论】：