Why do some CSS elements fail to appear in the IE Dev Toolbar's CSS tab?

Question

I've noticed that in the IE 8 Dev Toolbar's CSS tab, only some of the CSS elements show up. Does anyone know why that happens?

For example, in the CSS file, I might have:

.A
{
    cursor: pointer;
    color: #09F;
}
.B
{
    color: #999;
}
.C:hover
{
  text-decoration: underline;
}

But IE8's Dev Toolbar will show:

.A
{
    cursor: pointer;
    color: #09F;
}
.C:hover
{
  text-decoration: underline;
}

Answer 1

Just a guess, but maybe your document doesn't have any .B items, or maybe everything in .B is overridden everywhere it's used and IE garbage-collects it? Or maybe you're loading an old version of the CSS sheet from the cache and need to refresh it or clear your cache.

Answer 2

When I try your example, I don't get the result that you are describing. All the classes show up under the CSS tab, even if they are not used in the page.

The pseudo class C:hover doesn't show up in the HTML style information on an element that uses it, but it shows up just fine under the CSS tab.

If you have some incorrect CSS, for example omitting the # in a color literal:

.B
{
    color: 999;
}

Then the style is ignored if the page renders in standards compliant mode, so it naturally doesn't show up under the CSS tab. (If the page is rendered in quirks mode, the browser accepts the style eventhough it's incorrect and it shows up with the # added.)