Question

I have a simple info icon and I want to display it as css background image. This is what I tried:

span.info {
    background-image: url(info.png);
    float: right;
    width: 17px;
    display: block;
}

This is how I use it:

<span class="info"></span>

This does not display the image. I have to have some text, like this:

<span class="info">test</span>

This displays the image with text, but I want it without any text, just the image. Whats wrong?

Thanks!

Answer 1

You have to set a height in your style.

span.info {
    background-image: url(info.png);
    float: right;
    width: 17px;
    height: 17px;
    display: block;
}