CSS and templates

I had a quick question concerning css and a template i'm using.

I have two fields in my CSS:

.content
{
padding:10px;
width: 100%
text-align:justify;
font: 9pt/14pt 'Lucida Grande', Verdana, Helvetica, sans-serif;

}

#errorExplanation {
  width: 400px;
  border: 2px solid red;
  padding: 7px;
  padding-bottom: 12px;
  margin-bottom: 20px;
  background-color: #f0f0f0;
}

#errorExplanation h2 {
  text-align: left;
  font-weight: bold;
  padding: 5px 5px 5px 15px;
  开发者_开发技巧font-size: 12px;
  margin: -7px;
  background-color: #c00;
  color: red;
}

#errorExplanation p {
  color: #333;
  margin-bottom: 0;
  padding: 5px;
}

#errorExplanation ul li {
  font-size: 12px;
  list-style: square;
}

in my html code

   <div class="content">

        <div class="errorExplanation" id="errorExplanation">
           <h2> 10 errors prohibited this counselor questionary from being                             
                saved
           </h2>
          <p>There were problems with the following fields:</p>
       </div>    
   </div>

I would expect the #errorExplanation to be in red based on the css, but it isn't. I'm new to css, so I think i'm missing something.

An example is http://www.otoplusvn.com/TherapistSurvey/counselor_questionaries/new and press the Next button. You'll notice the error message pop up which is generated by ruby on rails validation, but its not in red. I want it to be in red and bold.

Any Advice Appreciated, Thanks!

Your CSS on the link you gave isn't containing the CSS code you pasted above. That's why it isn't red bordered.

I can't see #errorExplanation in your stylesheet on the site you provide. Is it definitely being uploaded? Or I might have missed it somewhere..

Your question stated "I would expect the #errorExplanation to be in red". I would imply you are referring to the background color. I would avoid wording a question as a preposition only because it creates a vague sense of relatively that can be hard to interpret over a text message.

Your CSS for #errorExplanation is declaring the background white, the border red.

To get the background red, here's what the code would be:

#errorExplanation {
  width: 400px;
  border: 2px solid red;
  padding: 7px;
  padding-bottom: 12px;
  margin-bottom: 20px;
  background-color: red; /* #f0f0f0 is white */
}