Hacker Newsnew | past | comments | ask | show | jobs | submitlogin

Do you have some pointers for standards compliant (or at least relatively compliant) CSS and HTML for rounded corners, gradients and drop shadows in IE 7 and 8 that don't require using DXImageTransform?

All of the information we found that had information on those three components offered either code that didn't work, required dozens of tiny little images, or used DXImageTransform which renders very poorly, particularly when there is text in the same element.

IE users are used to a crappy web experience, I'm stuck on IE 7 all day at my day job and a very large number of sites simple don't work. From fields you can't fill out, to misaligned elements, to sites that simply refuse to work on anything older than IE 8, FF or Chrome.

In our own site development we spent twice as much time trying to use various "tricks" to get IE 7 & 8 to look exactly like it looks in FF or Chrome. Either they worked in 7 but not 8, or 8 but not 7, or if they did work, looked significantly degrades over the rendering in FF and Chrome. Drop shadows were a particular problem. But many elements on our site use gradients, and any of those elements with text were virtually unreadable once DXImageTransform got ahold of them. In the end, short of rebuilding the entire site with dozens of little images, we decided to treat it like we'd treat the same problem with a traditional desktop graphics app -- Level Of Detail.

Just like with a desktop app running on low end hardware, where you make things work by lowering resolutions, decreasing draw distance, lowering polygon count, turning off anti-aliasing, frame skipping, etc. We chose to offer a lower LOD to people using a low-end browser. The site fails gracefully to this lower LOD with all of the functionality still intact. A red box with rounded corners and a slight gradient simply becomes a red box.

As it turns out, this works also on other oddball browsers like Opera. The last version of Opera would successfully render our site with rounded corners, but no gradients. So they got that LOD. The new version renders everything.

There's nothing weird about it, or bad attitudy about it. IE simply represents a less capable platform that should be treated as such. Our philosophy is to spend our dev cycles making good software rather than trying to coax a black and white tv to show color.



> Do you have some pointers for standards compliant (or at least relatively compliant) CSS and HTML for rounded corners, gradients and drop shadows in IE 7 and 8 that don't require using DXImageTransform?

You clearly know that there are no such pointers, and I am pretty sure you understood perfectly well what I meant in general.

I do not care if it is beautiful HTML/CSS that makes a web designer shine with a glow of harmony with standards. What I care about is for IE visitors to see rounded corners. There are ways to execute them, none of which is too complicated, most are butt ugly in terms of involved markup, but they work. That's all that matters.

> IE users are used to a crappy web experience, I'm stuck on IE 7 all day at my day job and a very large number of sites simple don't work.

This is irrelevant. There is me, a guy with a product, and there is my audience. Why the heck would I want to be like other poor sobs that cannot make a website look decent in IE? What sort of backward justification is that? Especially if I am seeing a good chunk of my visitors using IE.

> short of rebuilding the entire site with dozens of little images

You do what you gotta to do if you happen to value your IE visitors' experience. What are several dozens little images compared to stunned visitors' jaws dropping on the floor and their hands reaching for the wallets? :)

> we'd treat the same problem with a traditional desktop graphics app -- Level Of Detail.

Do name a couple of such apps. Short of games I cannot think of any.

> Our philosophy is to spend our dev cycles making good software rather than trying to coax a black and white tv to show color.

Sure thing, it's your decision, but as they say - first impression lasts and presentation matters.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: