Ok, I've been cranking away on a new layout for my site for a couple of weeks, and I'm down to the point where I'm trying to make it look not-too-ugly in non-decent browsers. Displays just fine in Opera, Safari, FF, and even IE7 (though Opera 9 had a weird-ass issue with inheriting margins for list items in XHTML1.0 strict pages that didn't show in ANY of the other standards compliant browsers, or even in it in XHTML1.0 Transitional). Surprisingly it even looks good in IE5 on the Mac without any tweaking.
I just hid the entire stylesheet from NS4 users (the 0.1% of people still using that pile should be glad that it's useable at all), it's decent in IE6 and IE5.5 with only one stupid hack for the 3px bug on floating images (I didn't bother fixing all the paragraphs adjacent to floats--the little jig ain't that important). It's a flaming disaster in IE4 but still basically readable and nobody uses it anyway. Just style-less in IE3, which is fine, not that anybody uses that anymore.
But that leaves me with IE5.0, which a tragically high percentage of people are still using. The site basically functions in it, but I have a row of links that I style to look like "buttons". And of course, IE5.0 ignores borders, margins, and padding on ALL inline elements, so they look kinda lame on it.
The chunk of code is basically this:
a { color: #ffffff; padding-top: 2px; padding-bottom: 2px; padding-left: 1em; padding-right: 1em; border: 1px solid #000000; background-color: #00445f; white-space: nowrap; }
Does ANYBODY know of a workaround for this? It's not worth some big hairy hack, but I couldn't find ANYTHING in an hour of Googling that did more than describe the problem.
Anybody?
I just hid the entire stylesheet from NS4 users (the 0.1% of people still using that pile should be glad that it's useable at all), it's decent in IE6 and IE5.5 with only one stupid hack for the 3px bug on floating images (I didn't bother fixing all the paragraphs adjacent to floats--the little jig ain't that important). It's a flaming disaster in IE4 but still basically readable and nobody uses it anyway. Just style-less in IE3, which is fine, not that anybody uses that anymore.
But that leaves me with IE5.0, which a tragically high percentage of people are still using. The site basically functions in it, but I have a row of links that I style to look like "buttons". And of course, IE5.0 ignores borders, margins, and padding on ALL inline elements, so they look kinda lame on it.
The chunk of code is basically this:
a { color: #ffffff; padding-top: 2px; padding-bottom: 2px; padding-left: 1em; padding-right: 1em; border: 1px solid #000000; background-color: #00445f; white-space: nowrap; }
Does ANYBODY know of a workaround for this? It's not worth some big hairy hack, but I couldn't find ANYTHING in an hour of Googling that did more than describe the problem.
Anybody?