How to show validation summary per condition in MVC3 Razor View?

I am not sure whether its a good practice or not but there is a need to display Validation summary conditionally. Actually, I need to display validation summary under Yellow Square so, I created a CSS class for the same and trying to do this :

@if (!Html.ViewData.ModelState.IsValid)
{
   <p>
      <span class="message-wrapper warning">
         @Html.ValidationSummary(true)
      </span>
   </p>                                           
}
else
{ 
    @Html.ValidationSummary()
}

The problem with above is, the Yellow square is visible always which not to ?

The Yellow square should be display only when there are Validation errors and these errors should be displayed within the 'Yellow Squ开发者_运维知识库are.

I am looking for the solution. Any help in this regard much appreciated!

Ideally you just can change the css class for this

.validation-summary-errors {
    background-color: #D9FFB2;
    border:1px solid #5CBA30;
    width: 400px;
    }

There are several covered methods here, so I won't repeat them all : )

Surrounding a ValidationSummary with a box via CSS