Best Image Replacement Technique
- by Josh Stodola
What is the best (as in cross-browser) technique to do image replacement in CSS? I am using sprites to do my navigation, but I want the markup to remain SEO friendly. Given the following HTML structure...
<div id="menu">
<ul>
<li><a href="#">Test</a></li>
<li><a href="#">Tester</a></li>
<li><a href="#">Testing Testing</a></li>
</ul>
</div>
What is the best way to replace the text with a background image using CSS only?
I am currently using this...
text-indent: -9999px;
But, it fails with CSS on, and images off.