Comments on: CSS Image Replacement

By: Creating Theme Options

Creating Theme Options — Thu, 30 Apr 2009 19:00:25 +0000

[...] if your banner is using the image replacement technique, then you’re best off adding an action to add the CSS style needed to the wp_head() function [...]

By: Sarah

Sarah — Mon, 06 Apr 2009 08:00:38 +0000

Hi Robin, the problem with using a text indent off screen is when someone doesn't get the images to load, they can't see the text underneath.

The method I've explained and use is the most suitable for image viewers, non image viewers and non CSS viewers. The only downside is when using a transparent image.

If you read the link I posted you'll see your method along with several others and it explains the pros and cons of each.

By: Robin Cannon

Robin Cannon — Mon, 06 Apr 2009 07:55:50 +0000

Is there a reason why you're choosing to style a span within the h1 tag, rather than the tag itself?

The main drawback of this method is that if your image used is transparent then the text underneath will show through.

I'd tend to use h1 {text-indent: -9999px} or something similar, which would remove the text from the screen but still make it readable by search engines or screen readers.

By: Neil McDermott

Neil McDermott — Sat, 04 Apr 2009 10:37:22 +0000

Great post.

Very easy to use and clearly explained.

By: Skumar

Skumar — Fri, 03 Apr 2009 05:08:59 +0000

wow such a useful tip on using fonts for blogs or websites using CSS, I m going to try this, Thanks Sarah for the tips!

By: Consumer Research

Consumer Research — Thu, 02 Apr 2009 19:09:44 +0000

great post for coders……..

as i each one will be happy by the blog