I’ll introduce a tip for image replacement with CSS.

.hide-text { 
    text-indent: 100%; 
    white-space: nowrap; 
    overflow: hidden; 
}

It seems that using text-indent:-9999px; was mainstream in the past, but now the above writing style is apparently mainstream.

One thing to be careful about is receiving penalties from Google for hidden text.

• Google Webmaster Central Official Blog: Hidden text violates Google's Webmaster Guidelines

If the image content and text don’t differ, it seems you won’t receive Google’s penalty for hidden text. So as long as you’re not doing bad things like replacing images with unrelated text, there should be no problem.

Reference Information

• [CSS] New technique that improves performance of image replacement "-9999px" | Coliss
• Replacing the -9999px hack (new image replacement) | Jeffrey Zeldman Presents The Daily Report: Web Design News & Insights Since 1995

That’s all from the Gemba.