I really don't want to have one style sheet for IE 6 and another for well-behaved browsers. I used a pretty common hack to get most of my png files with any amount of alpha to work, but one of them is a background image in a rule laid out in my CSS file.

I think I can get it to display properly if I can change it from being a background-image to filterrogid:XImageTransform.Microsoft.AlphaImage Loader, but I'm not really sure how to do this, or whether it's possible? The div has an ID, and the style is applied that way ( #leftNAV in CSS ), so I can grab it with document.getElementById, but I don't know if you're allowed to change it, or what property to use.

And being stumped like this makes me wonder if I'm approaching this the wrong way. I can't ignore how many people still use IE 666, but I hate the idea of making my site more and more complex with all kinds of hacks, especially for an outdated browser.

Would it make sense to recommend and link to FireFox? A long time ago I read "this site best viewed in Netscape" offended people with other browsers; I know times have changed, but any thoughts on whether this is a good idea?

Saying "this site is viewed in" is never a good idea. You're forcing your rules on someone else, and that's not a good practice.

Personally, I'd continue to do what you were doing. If you can get it to work the way you want it to properly across all browsers and the code is relatively clean (it'll never be completely clean as you'll have the hack no matter what), then there really is no wrong answer.

To change a hyphenated CSS property with javascript you use the property name change the first letter of the second word to Uppercase and remove the hyphen
So:
background-image = backgroundImage
margin-top = marginTop
and so on

to reference a CSS property use the style object

document.getElementById("elementID").style.propert yName = PropertyValue

You don't really need to use "hacks" as such, which may have unwanted effects, Just use IE conditional comments

To add more detail to the JavaScript answer... Every DOM node (element) has a .style property, which in turn has a collection of properties for every CSS attribute recognized by the browser. chrishirst already described the camelCasing of those properties.

So for example, you might wind up with:

document.getElementById("main").getElementsByTagNa me("a")[foo].textDecoration = "none";

MSDN Library's Web docs are really helpful in this respect.

As for IE... what I do is to put all of the IE-focussed rules in their own linked stylesheet, and the non-IE7 rules live behind

* html etc.

within that stylesheet.

If you feel that scripting styles would be a better approach in the long run, just make sure you can live with the potential range of consequences that users will need to deal with as a result (specifically in regard to resource usage and site accessibility).

Finally, I don't see what's wrong with putting a "Best Viewed with" notice in the footer of a hobby/personal site. It definitely brings back some unpleasant memories, but it's the equivalent of pointing out to your users that some contents may have settled during shipping.

If you're getting paid, it's a different story - the time spent testing and doing QA against IE6 should be accounted for in your Statement of Work and/or contract, and properly invoiced. If the client doesn't like it, then they need to be briefed on the consequences.

ISDN is crap for web developing...google it...

Originally Posted by eXistenZ

ISDN is crap for web developing...google it...

And what exactly has a digital telecomms syatem got to do with web developing ?

There is nothing whatsoever wrong with using a separate stylesheet for IE versions - that's what conditional comments were meant to do - steer IE to use a separate stylesheet. However, you do not have to reproduce an ENTIRE stylesheet for IE, the only things you put in the 'fixes' CSS file is the hacks we are forced to use to kick IE into submission.

Well, I got more and better advice than I expected - thanks, everyone!

So it sounds like using javascript to change a property that was set with an external stylesheet is perfectly valid? I don't know why, but that threw me off. Can I set the backgroundImage to null?

If I went with a second stylesheet, how would that work? If I used a conditional comment to call it out ( and I'm already using one for pngfix ), that comes after the main stylesheet, will the IE 6 styles override the main ones? With FireFox and IE 7, I would want to set the background image to a png file, but with IE 6, I need to not set the background image, and instead set the "filter" IE-only ... well, whatever you would call it. From what I gather it's a set of ActiveX extensions built into the browser, and won't run on server operating systems. But there's nothing I can really do about that.

If you use conditional comments to target IE 6 and below, it WILL look to your main CSS file for everything else, but for those 'fixes' in the separate CSS file, it will use THOSE instead. That is why it isn't necessary to completely duplicate a CSS file, it looks at ONLY the rules you give it for IE.

There is a javascript method for PNG transparency that works pretty well, as long as you don't want any repeating:
http://homepage.ntlworld.com/bobosola/pnghowto.htm

Can I set the backgroundImage to null

Not to null, just set to to an empty string.

.backgroundImage = '';

http://www.w3schools.com/htmldom/default.asp