Why is my css not being applied to my page? - css

Question

I recently message boxes that style a message given during a php statement, and they style the message.
This is my php code.
mysql_query("UPDATE account SET is_active=1, activation_code='' WHERE activation_code='$code'");
$message_good = '<div class="register_thankyou"><p>Success! Your account has been activated. You may now log in.</p></div>';
} else {
$message_good = '<div class="register_error"><p>Account has already been activated, or you have an invalid activation code.</p></div>';
}
For some reason, it loads the style register_thankyou but not for register_error.
Both styles have this css setup.
/* ACTIVATION MESSAGES */
.register_thankyou {
background-color: #e3f6da;
border: 1px solid #3b7008;
padding: 20px;
}
.register_thankyou h3 {
font-size: 20px;
font-weight: normal;
margin: 0 0 10px;
padding: 0;
}
.register_thankyou p {
margin: 0;
padding: 0;
}
.register_error {
background-color: #f8e5e4;
border: 1px solid #c41100;
padding: 20px;
}
.register_error h3 {
font-size: 20px;
font-weight: normal;
margin: 0 0 10px;
padding: 0;
}
.register_error p {
margin: 0;
padding: 0;
}
All thats different is the background and border color
Can someone explain to me why one style is being applied and the other isnt?
Thank you:
error:
it works on here tho: http://jsfiddle.net/q8ozgfmu/

Answer 1

As i alarmed alien said, check in the Browser's inspector. The style might be getting overridden. Or the other reason could be that the updated style.css may not have loaded in the browser. Try clearing the cache and load the page again.