Awea
Awea

Reputation: 3173

Firefox Extension content script with css and background images

I'm currently finishing a firefox extension which uses some content scripts. One of them appends some html/css in the current tab with JQuery:

var content = ''; //a lot of html
$('body').append(content);

It's worked well, but the background image in the css won't work:

var content = '<style type="text/css">#elem{background:url("http://example.com/image.png") no-repeat center center;}</style>';
content += '<div id="elem"></div>';

The div was here and the style was applied to it, but no background image at all. I've tried with a simple img element it doesn't work, either.

Does anyone have an idea what's wrong here?

Upvotes: 0

Views: 432

Answers (1)

Lori
Lori

Reputation: 1422

style tags belong in the head, not the body.

I also found that I had to add height and width properties to the selector for "elem" in order for the thing to be visible.

Upvotes: 2

Related Questions