Page is a not externally linkable
- Code, Content, and Presentation
-- CSS
---- Fahrner Image Replacement (FIR)


DrDoc - 5:05 am on Jan 29, 2004 (gmt 0)


Let's take a heading as an example...
Give it a top padding (equal to the height of the image you want to use)... set overflow to hidden... Then apply the image as background to the heading.

Works great for screenreaders and people without CSS capabilities.
The only downside would be those that browse without images...

You can apply the same principle to create a drop-cap effect. Use padding to shove the actual letter out of view, and then the image as a background. Just remember to use the :first-letter pseudo instead of wrapping the letter in a span tag :)


Thread source:: http://www.webmasterworld.com/css/2757.htm
Brought to you by WebmasterWorld: http://www.webmasterworld.com