molly.com
Sunday 27 November 2005
On CSS Hacking: The Post You Must Read
IF THERE IS ONE POST ALL WEB DESIGNERS AND DEVELOPERS MUST READ this year, it’s Tantek Çelik’s eye-opening “Pandora’s Box (Model) of CSS Hacks And Other Good Intentions.”
The piece chronicles the fascinating history of CSS hacks, how they came to be, and why. And who better to cover this issue than one of the most infamous creators of CSS hacks, despite all best intention? Tantek continues beyond the historical to discuss the challenges that browser developers face when dealing with hacks, including commentary on Microsoft IE 7.0 and the very real and problematic impact that certain kinds of hacks can cause.
Wrapping up with some excellent advice about what we can all be doing now to avoid trouble in the future both near and far, Tantek’s article, originally posted to his own site and now to WaSP, proves to be as practical as it is philosophical.
Filed under: WaSP, software, standards
Posted by: Molly | 04:04 | Comments (35)
This is why I am (and always have been) steadfast in my refusal to use box model hacks etc etc.
If you can’t do something without hacking it into place, perhaps its worth reconsidering what you’re trying to do so that it works on whatever you’re viewing it with. At least this way it will function just as well on newer browsers.
I’ve never understood the fetish for perfectionism across all browsers – you will never get it with a reasonbly complex layout, there will alwyas be a discrepancy … but isn’t your job to make sure that the discrepancy doesn’t interrupt the conveyance of information to the user? After all, they can always turn off styles and get the raw information if it is semi-obscured by a misbehaving entity.
Thoughts?
Amazing article. How things can get out of hand.
I believe that there is someone, somewhere, out there, that can write a similar article about how tables and pixel size images were thought about, and what happened since then. Think about it.
Ranaan: see “The Web is Ruined and I Ruined It” ( http://www.xml.com/pub/a/w3j/s1.people.html ). Note that this was written 8(!) years ago.
It’s a great history of hacks; but it’s a pity the conclusion still has to include "wait for browsers to get better"
Great article, but I can’t see the final call for action (rely on standards), working until browsers support them; and even then it won’t be good enough for some clients. Like a certain UK government site that requires XHTML, CSS-P, WCAG A and compatibility with IE3; whilst demands like this are in place what hope have we got!
His article goes into much more depth than my own, but I find it interesting that we hit on so many similar points. My article is located here: CSS Hack and Slash
http://blocklevel.com/weblog/open_standards/css_hack_and_slash/
Hey Robin, i enjoyed that link. Kind of strange to read knowing it was written so long ago.
Interesting comparison between the articles by Tantek and David Siegel but I don’t think Tantek (and others) ruined the web (again!) by introducing workarounds or hacks.
David Siegel was talking about hijacking code to make it do something it wasn’t meant to. CSS *was* created for visual layout — it just isn’t consistently supported.
CSS workarounds are an opt-in decision. They are usually used when designers want a more precise or complicated layout. You can create perfectly usable, hackless, layouts with just a little knowledge of box model support.
A far cry from the spacer-GIF, stacked-tables, font-tagged, frame-based mess of the ’90s.
@Steven Woods: I’ve never understood the fetish for perfectionism across all browsers – you will never get it with a reasonbly complex layout, there will alwyas be a discrepancy … but isn’t your job to make sure that the discrepancy doesn’t interrupt the conveyance of information to the user? After all, they can always turn off styles and get the raw information if it is semi-obscured by a misbehaving entity.
I think you hit the nail on the head. Visual styles across browsers shouldn’t be identical if it means sinking huge amounts of money and time into the design/code. Good design should be practical. Practical design should be flexible enough to allow for minor differences in browser presentation. Unfortunately, usually these differences are not minor, but mammoth, and they usually involve IE –the largest installed base of browsers. Just as you shouldn’t prevent disabled people from using your site, you shouldn’t prevent the bulk of the internet population from using your site. So some time-sink is necessary so everybody has a good user experience.
” After all, they can always turn off styles…”
I keep reading this in different places, but I have never heard any evidence that the average user would know how to turn off styles in IE (or would care to). Heck, I am not sure if I know!
Does anyone have any supporting info?
[...] gs: browsers, css, hack, Molly, Tantek Celik, web standards. Molly says: “IF THERE IS ONE POST ALL WEB DESIGNERS AND DEVELOPERS M [...]
I am sure glad I read this and your right a article that is a must read.Browers must get better Ben as they no doubt will!!
The one point I don’t understand, as Anne also mentioned, is his opposition to * html. Yes IE6 is not obsolete yet, but it has CSS bugs that are mighty difficult to get around even when coding by the specs. Is he suggesting use html>body and limit to real CSS2.1 browsers? It makes more sense to me to leave the good CSS2.1 in the regular style declarations, then use a * html to send special CSS to correct bugs, knowing no other browser will pick it up – it’s targeted to IE5/6.
Agreed, though, his article is a must-read and quite timely.
Love to read your website for the little tidbits of information.
Best Wishes,
Tantek’s article is utterly brilliant (as expected)….but I’m left feeling that all the mastery of hacks and workarounds shouldn’t be neccessary at all if the browser technology had got it right in the first place….(but where’s the challenge in that eh?!)
He makes numerous really good points – and hacks are still going to be gracing code for years to come yet.
I completely disagree with all of this.
Afterall, designing would be so boring without hacks.
Edward J. S. Atkinson:I with you disagree.
November 28, 2005 Tantek on CSS Hacking Molly Holzschlag, of the Web Standards Project, writes IF THERE IS ONE POS [...]
[...] 올해부터는 IE6 아하 버전의 CSS랜더링 버그를 위한 대표적 Tantek핵을 사용하지 말라는 경고(via Tantek, Molly도 있던데, 얼머나, 어떻게 개선됐는지 궁금하다. [...]
[...] Molly says: “IF THERE IS ONE POST ALL WEB DESIGNERS AND DEVELOPERS MUST READ this year, it’s Tantek Çelik’s eye-opening “Pandora’s Box (Model) of CSS Hacks And Other Good Intentions”.” My conclusion on this: learn the proper CSS codes, do it, validate it, and wait for some browsers’ company built one that actually support it. And why did Molly wrote that line in all capital and bold font? It must’ve been really good. [...]
I don’t like hacking, this word sound bad in my ear,what is the synonym for this bad word?
Love to read your website for the little tidbits of information.
a like here
ok
Hacks sure are a problem. The minute i connected my website on the web i had some php bot crawling my content to find php vulnerabilities. I wish we could just all try to get along and stop trying to hack each other stuff :/
interesting hack method from css.
Thank You.
thanks for your sharing
thanksss
thankss
thankssss..
thanks..
thankss
thanks..
Thank You.