A better image replacement technique
5th August 2003
Over on Kryogenix, Stuart has solved the CSS image replacement problem with some clever application of the overflow: hidden;
property. The Fahrner Image Replacement technique is often used to replace a heading with a background image (see most of the designs in the CSS Zen Garden for examples), but has the disadvantages that it requires an additional <span>
tag to be added to the code and that some screen readers which follow the display: none;
directive skip straight over the replaced text without reading it. Stuart’s new technique solves both problems, and works in modern browsers from IE 5/Win upwards.
More recent articles
- Image segmentation using Gemini 2.5 - 18th April 2025
- GPT-4.1: Three new million token input models from OpenAI, including their cheapest model yet - 14th April 2025
- CaMeL offers a promising new direction for mitigating prompt injection attacks - 11th April 2025