0

I am looking for help in how to change a CSS created image

It's a info icon that lives in a header to an image in IE6. The image is a .png

<h1>header title<\h1><a href="#" id="info-icon"><span>i</span></a>

Currently the CSS image icon is absolutely positioned off the relative header. Maybe it should be floated?

I'm just not sure what coding logic to use to replace the png image in same spot as the CSS image. Does it involve conditional logic?

Any help would be much appreciated.

Doug

Dustin Laine
  • 37,935
  • 10
  • 86
  • 125
user763460
  • 221
  • 2
  • 8
  • 18
  • 3
    Not following, there is no such thing as a CSS image. Are you referring to a background image? Can you post an example? – Dustin Laine May 20 '11 at 22:14
  • I don't know if it's a typo in copying your code to Stackoverflow, but your closing `` tag is wrong. – David Thomas May 20 '11 at 22:26
  • You can use [conditional comments](http://www.quirksmode.org/css/condcom.html) if you want IE6 to literally use different code than other browsers. – sscirrus May 20 '11 at 23:15
  • Dustin - I mean a CSS created image. It's an icon. The CSS styles create it. Rounded corners, etc. – user763460 May 21 '11 at 12:50

1 Answers1

0

What you can do is put your image inside that link or span (wherever your "CSS image" is defined) and then use conditional CSS rules to hide the image for non-IE6 browsers. However, it's bad style to use conditional CSS. What is the general problem you're trying to solve? Why do you want to use a PNG for IE but a background image for other browsers?

T Nguyen
  • 3,309
  • 2
  • 31
  • 48
  • Thank you for your reply. To clarify, I want to use a CSS created icon (CSS3, rounded corners, etc for webkit, moz browsers) and because IE6 will not display (or can render this CSS3 code) I want to have it display a png image icon instead. Does that help clarify??? – user763460 May 21 '11 at 12:47
  • It's still a little bit unclear. Is this "CSS icon" in the foreground or background? If it's in the foreground, it seems like you would be better off making it a traditional image icon so you don't have to add conditional CSS logic, which is not semantic and prone to bugs. If it's a background image, I would recommend that you turn it into a foreground image icon, again so that you don't need to use conditional logic. – T Nguyen May 22 '11 at 02:09