Skip to Content


Public news / December 2005 / CSS Logo Replacement

CSS Logo Replacement

A useful CSS method for delivering separate logo images to print and screen.

permanent link 17 dec at 21:59 by Nick

There are 6 guest comments so far.

commentat 22:39 on 17 December 2005, Clemens Krack wrote:

Wow. Breaking news that is!

What a great new invention.

NOT

commentat 23:33 on 17 December 2005, Michael Zipser wrote:

Yes, that is really not new to me.

commentat 01:57 on 18 December 2005, Bramus! wrote:

display: none; is not done, since screenreaders can't read it ... and erm, there are MANY css image replacement techniques available already (I prefer MIR), that are built in a better way than yours...

commentat 10:16 on 19 December 2005, Chris wrote:

I'm really struggling to understand why you would need this technique, when it would be much easier to simply use a specific print stylesheet?

(e.g <link href="style.css" rel="stylesheet" type="text/css" media="print" />).

Define different images in your screen and print stylesheets and you're good to go!?

commentat 15:18 on 19 December 2005, Nick wrote:

Chris,

There is a problem with defining different background images for screen and print. When you print the page, background images typically won't print. That is why I left the image tag in there.

commentat 15:19 on 19 December 2005, Jens Kristensen wrote:

This technique works even if users print without background images and colors. Specifying a different background image in a print style sheet does not. It may not be revolutionary, but it is a nice little trick.

Add a comment:

(required, non-public)

  |  Chars left: 1000

Keep the comment relevant, constructive and be polite.
A valid email address or URL to your site must be provided, or the comment might get deleted. Content seemed inappropriate or offensive may be edited and/or deleted. Avoid explicit language and words such as "sucks" and "ripoff". For more in-depth discussions use our forum. Email addresses are never displayed. Line breaks and paragraphs are automatically converted - no need to use <p> or <br/>. Quotes & apostrophes are automatically converted to smart punctuation. Be careful when copying and pasting portions of entries or other comments. The following inline HTML elements may be used: <strong><em><pre><q><blockquote><code>. All other code will get removed before posting. Don't forget to close your tags.


Search the archive

Stylegala news archive

Public news archive

News contributors


Features

Stylegala BookStore
The Stylegala BookStore has a massive archive of great books for you as a professional..
Bullet madness
Bullet madness is a list of 200 bullets, arrows and icons uploaded by our users.
CSS Reference
An alphabetical list over the most common CSS1 and CSS2 syntax and properties.

Sponsors

Logo design for $149

Advertise here