Question

I have a header text in a h1 tag. I’d like to have a small icon at the end of the text (so on the right side of the text)

The text varies in length obviously.

I have set the h1 style to have a background image, no repeat, but it puts it way over to the edge of the div.

Any way I can get it to always line-up at the end of the text? I’m presuming this can’t be done with a bg-image like I have tried?

h1 {
background-image:url(images/quotemarks.png);
background-repeat:no-repeat;
background-position:right;

Answer 1

Try this:

h1:after {
    content:url(images/quotemarks.png);
}

DEMO