Chrome extension's CSS is not loaded

Question

I'm developing a "content script" Chrome extension. I'm trying to use a CSS files to style some existing elements on a page and to style elements that I create dynamically with JavaScript.

I've specified my CSS file in the manifest.json file:

{
    ...
    "content_scripts": [
        {
            "matches": [ ... ],
            "js": [ ... ],
            "css": [ "style.css" ]
        }
    ]
    ...
}

And then if I put something like below into my style.css nothing happens:

body {
    background-color: red;
}

I've also put some rules in the form of:

#MyInsertedEl {
    color: red;
}

And then inserted (using jQuery) a element with the id of MyInsertedEl (anchor link) into the page but it's colour is not red (the element is inserted and visible in the page).

So what gives? What am I doing wrong? According to the docs I've got everything as I should, and google does not return anything useful.

edit: this code is run on facebook's pages if that is relevant in any way ...

Answer 1

Is your javascript getting injected (match rule is correct)? Try adding !important to your css rules:

color: red !important;

Answer 2

Well, apparently, there's a bug in Chrome. If you have a ? in your matches expression CSS files will not be loaded. I've filed a bug report with more details here.