CSS Hide Text But Show Image?

Question

I need to change something without touching HTML codes.

So I have this code in my HTML

 
    

        
Sha         


        

Answer 1

use text-indent with a little magic in it :)

HTML:

            
                

                    
Share   
                    
twitter
                    
facebook
                    
delicious
                    
friendfeed
                    
share
                    

                
            

CSS:

a.twitter {
    background-image:url('../images/tt.png');
    display:block;
    height:58px;
    text-indent:-9999px;
    width:200px;
}

So you see the text is indented but still the image is still clickable because i've put a class in the twitter link ;)