Question

How can I display an image instead of a text for a hyperlink? Please see my example, here you can see the text “x” and the background image. I want to show only the background image for the hyperlink.

http://jsfiddle.net/8rfyT/

Answer 1

.cancel {
    background: url(http://www.softicons.com/download/web-icons/light-grey-square-icons-by-axialis-team/png/16/Cancel.png) center no-repeat;
    text-indent: -9999px;
    display: block;
    width: 16px;
    height: 16px;
}

make the link display: block; so you can give it the width and height of the background image, then use text-indent to hide the actual text

Your fiddle updated