Google Chrome - CSS text-transform not working

So I have this code that works in firefox but not chrome. All I am doing is just styling some text. I don't understand why it doesn't work in chrome.

#hidden {
    color: #999;
    text-decoration: none;
    text-transform: uppercase;
}

And html

<p id="hidden">**hidden**</p>

Chrome is returning the unaltered version (a black, not uppe开发者_StackOverflow中文版rcased **hidden**)

While firefox kindly returns a gray **HIDDEN**

So is there any fix for this? I am kind of shocked chrome doesn't support something so simple.

I'm taking a guess at this, but it could just be the way that Chrome deals with errors in your markup. In my experience, Chrome tends to ignore any CSS that is below invalid CSS, which leads me to believe that the most likely cause for this is that you have an error in your CSS or HTML.

A really quick, nice check for this is to set the element you are concerned isn't updating to display: none; and see if it disappears. If it is still visible, the problem is on a different element. You can also use the W3C HTML Validator and CSS Validator if you are looking for some nice, automated tools for checking your markup.