Question

I'm in the process of porting a Chrome extension to Opera Next. Everything seems to be working except for CSS images.

In Chrome, we're specifying an image in CSS like this:

#webapps-compose img {
  content: url("chrome-extension://__MSG_@@extension_id__/skin/webapps/compose-128.png");
}

Will this work on Opera Next when it is released?

Was it helpful?

Solution

There's no need to specify chrome-extension://__MSG_@@extension_id__ in your stylesheet, even if you're embedding the style sheet on a non-extension page.

url()s within a stylesheet are always resolved relative to the path of the style sheet itself. So, it suffices to use the following style sheet, the image will correctly be displayed.

/* .css file within your extension directory */
#webapps-compose img {
    content: url("/skin/webapps/compose-128.png");
}
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top