CSS Sprites techniques tried   and tested

Return to Dave Taylor

All these sprite techniques will have been tested on the following browsers, if you notice an issue

• win: ie6, ie7, safari 4,ff 2.0, ff 3.5

Sliding doors

Here's a faux button Here's a faux button

Sprites inline with padding   running with the text flow

Larger sprite working with text flowing around Lorem ipsum dolor sit amet, consectetur adipiscing elit. In feugiat aliquam quam, at pharetra purus mattis dictum. Fusce vel bibendum sem. Maecenas at elementum nibh. Mauris accumsan mattis turpis, vitae blandit arcu ornare ultricies. Duis lacus diam, scelerisque vitae volutpat in, laoreet vel mauris. Etiam id nibh purus. Nulla facilisi. Vivamus

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In feugiat aliquam quam, at pharetra purus mattis dictum.   Fusce vel bibendum sem. Maecenas at elementum nibh. Mauris accumsan mattis turpis, vitae blandit arcu ornare ultricies. Duis lacus diam, scelerisque vitae volutpat in, laoreet vel mauris. Etiam id nibh purus. Nulla facilisi. Vivamus

Lorem ipsum dolor sit amet,consectetur adipiscing elit. In feugiat aliquam quam, at pharetra purus mattis dictum. Fusce vel bibendum sem. Maecenas at elementum nibh. Mauris accumsan mattis turpis, vitae blandit arcu ornare ultricies. Duis lacus diam, scelerisque vitae volutpat in, laoreet vel mauris.   Etiam id nibh purus. Nulla facilisi. Vivamus

These sprites are contained within the following image