cssRules/rules are null in Chrome

Question

My chrome extension needs to modify certain css rules on user\'s page. Accessing styles via document.styleSheets only gives access to styles linked from within

Answer 1

Content scripts don't have any cross-domain privileges comparing to a regular javascript, so any limitations are carried over. See related question #1, question #2.

You can inject your own css style in the manifest:

"content_scripts": [
    {
      "matches": ["http://www.google.com/*"],
      "css": ["mystyles.css"]
    }
]

where you can try to overwrite original styles by defining rules with higher specificity.

You can also just tweak concrete element styles through javascript:

document.getElementById("id").style.property="value";

Answer 2

I fixed my version of the issue by changing the url from http:// to https://. Doh!