hide <a> text with css

I want to hide the "HOME" text and replace it with an image on my wordpress menu. I am using the following css code right now:

li#menu-item-63 a {
background: url(/images/home.png) top center no-repeat;
width: 24px;
height:24px;
float: left;
text-ident: -9999px;
overflow: hidden;
text-decoration: 开发者_如何学JAVAnone;
}

With the code above the image appears but the HOME text is still there. Thanks

text-ident: -9999px; 

should be

text-indent: -9999px;

You could add

color: transparent;

to your style. Will hide the text.

text-indent, not text-ident.

And display: block