Slashdot Mirror
Making IE Standards Compliant
spin2cool writes "Dean Edwards has taken it upon himself to make Internet Explorer W3C compliant. How? Well, it isn't by patching the application, as you might suspect. He's created a stylesheet, dubbed 'IE7' that uses DHTML to load and parse style sheets into a form that IE can understand. Just include the style sheet in your HTML pages, and things should render correctly. The complexity of the CSS transformations is really amazing and shows off the power of this stuff."
I wish someone would release such a sheet for firefox : /. itself still doen't render correctly on FFox 0.8 under XPpro. As shown here, the left column tends to dribble into the article summary...
When will I end this grieving ? When will my future begin ?
Site is already slashdottet. Here's Google's cache of the document.
So - how are the plans going with implementing a slashdot cache?
Underholdning.info
If the author would like to email me at mirror@asheesh.org, I'd be happy to mirror this site. I have more than enough bandwidth to cover it.
-- Asheesh.
|/usr/games/fortune
If you havent already yet, you should of switched from IE to Firefox. It is now my default browser on Windows, and on Windows XP it even puts it as the top Start menu item. It is fast, light, small download (6Mb), Tabbed Browsing, Popup blocking, Download manager, Cute icon and standards compliance are all good reasons to use it. So don't use an ugly hack to transform your pages for IE, put a firefox icon on your site.
So if you havent downloaded it yet, get it now!. Avalible for Windows, Linux, Mac OS X and more!
found here
AFAIK there is no browser available that correctly renders CSS 2.0 -- the entire spec.
IIRC Moz and Opera do render all of CSS 1.0 correctly and nearly all of CSS 2.0 correctly. But doing some advanced things with CSS 2.0 (especially doing all formatting with it, instead of old table hacks) you really run into problems with both Moz and Opera.
Use a Mozilla Firefox nightly build, the bug (217369, I think) that caused this problem is fixed in them.
More major changes since 0.8 here.
"You should never doubt what nobody is sure about." -- Willy Wonka
The title of the news is misleading : this JS component only corrects some CSS 2 selectors that IE doesn't natively support.
So it doesn't really make IS standards compliant, it just extends some functionnality. It doesn't, for example, correct the box model of IE5.
So I'm afraid it doesn't spare us of using CSS hacks to filter out IE.
in reality, they can of course by not using closed source software, but for some it seems percieved convenience is more important than freedom, but I digress)
What this does is allow developers of standards-based sites, which they have under their own control, to provide a stopgap for users who don't understand the issue of standards and so haven't themselves chosen freedom. So your digression doesn't quite match the facts. As a developer, I can choose to make my site work in Mozilla and KHTML - and will - but I can't choose to force my audience to use them. With this, if it works as advertised, I can choose to follow standards and still provide some means for those who have, for whatever reasons, chosen to use a non-free browser to use my content.
I made this mirror based on the Google cache. It has the full source code, as well as the docs he wrote.
This is temporary, of course.
|/usr/games/fortune
try this one
Ceci n'est pas une
You are right, which is why some of the more esoteric features have been removed from CSS 2 and CSS 2.1 is about to be released.
However this is a lot different to Internet Explorer 6's situation. There are massive amounts of CSS 2 that simply aren't implemented, such as a whole bunch of selectors and tables.
The next time you see somebody complaining that CSS layout is hard, remember that there's probably a way to do what they want in a few lines of CSS, but that part of CSS simply doesn't work in Internet Explorer (but does in Mozilla, Konqueror, Opera, etc).
To a limited extent, yes.
Oh come on, people, do a View Source for yourselves. Go on, I dare you. Slashdot's HTML is hideous just to look at and horribly out of standards compliance.
via Google Cache : IE7.htc
This is only the IE behavior itself. (27 kB)
Visit the containing directory to see a fix for IE's PNG rendering bug that also works on background PNG images.
Just in case you haven't realised, IE5.5 is quite different to both IE5 and IE6. I myself tested a site once using IE5 and IE6 assuming that IE5.5 would be much the same as one of them... but oh no, its got its very own strangeness! And Mac IE is of course different again.
Even if other browsers don't fully support the latest standards, at least they're showing regular progress. IE's renderer hasn't been changed since IE 5.5 around 5 years ago. And even though it's claimed to be fully compliant with CSS 1.0, it has been proven to be otherwise.
Offtopic? Oh, come on!
"who woulda thunk it?"
thunk -- code that performs a translation or conversion... like the stylesheet?
Okay... so I'm stretching definitions slightly. But I'll do anything for a pun.
What's the frequency, Kenneth?
The code itself at the moment is 27k, which is kinda hefty for most pages on initial load (though you'd only have to load it once per site). However, it includes loads of comments, which might slim it down to about half that if you stripped them out. And the savings in other code areas by not having to write double-code and browser-detection are probably worth it overall.
:-)
This would certainly make development a lot easier... I look forward to trying it out
Can someone temporarily host my site? some of it is php4. is that ok? mail me at dean@edwards.name and cc 9jack9@msn.com. i can chat on the msn account if necessary. thanks. dean edwards
The parent post is quite correct. This is basically a hack. A technically proficient, useful hack, but a hack nonetheless.
.uniquename {font-family:"comic sans ms";}
I believe (and I can't check as the site is down) that the effect of the stylesheet is to:
a) scan the stylesheets that come with the document and look for certian types of unsupported selectors
b) Replace those selectors with ones that IE does understand (i.e. copy the style rules to a new selector)
c) Scan through the html of the document and look for elements that matched the original (unsupported) selectors
d) Add a class attribute to the elements that should have matched the old selector that causes it to match the equivilent selector that IE does understand
e.g. an selector div > p will match p that is a child of div. IE doesn't understand child selectors, so given a rule:
div > p {font-family:"comic sans ms";}
the stylesheet will create a rule
and given a piece of document that should match like:
<div>
<p>
Isn't IE great!
</p>
</div>
It will be replaced (in memory) by something like:
<div>
<p class="uniquename">
Isn't IE great!
</p>
</div>
This will allow the IE style engine to apply the correct formatting.
These kinds of browser checks are the same reason why browsers like Opera needs to fake the User-Agent. This page of yours would also block Opera. Let people use whatever browser they want without blocking them.
This is what Opera 7.20 uses by default:
Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1) Opera 7.20 [en]
Because it contains MSIE it fools a lot of scripts, like yours.
Just to clarify slightly - IE7 doesn't rely on serving up a different stylesheet, but an additional 'sheet. In other words, if you reference IE7 as your first 'sheet, existing stylesheets for compliant browsers will then render OK in IE.
If I've read it right you don't even need to sniff (well, at least not in the old-fasioned, java-script or server-side script sense): it's all done through CSS.
This is where the serious fun begins.
I remember back then, when Netscape Navigator 4.* was alife, we used to bitch about it in the company. Whatever you wanted to do, dhtml, layers, css and other modern cool stuff, it looked cool in IE but totally failed in NN. We had to include alot of workarounds for NN.
Today, we have Mozilla, KHTML/Safari and Opera and we can do what ever we want to do, all the modern stuff like CSS 2.0, tableless page layouts and other funky stuff you want to do in the year of 2004. It looks great in all browsers, except IE. Nowadays IE is the bad kid who destroys the party. I hope MS fixes it soon or lets it go the NN 4.* way.... please...
Not a while ago there was a post about retooling slashdot with valit html.... all they have to do to use that. it would even look good in lynx or w3m.
Retooling Slashdot with Web Standards
thanks to all those who have offered to mirror/host my site. i'm currently working on a solution so i should be back up again soon. thanks to Asheesh Laroia there is now a temporary mirror here: http://jhunix.hcf.jhu.edu/~alaroia1/dean/ please note: only the html test files work on this mirror. thanks again. dean edwards
I've done this too: http://dean.edwards.name/moz-behaviors/ (when my site is back up!)
I know this is not new to a lot of people judgeing by the number of hits I get when searching for solutions. IE's submit button doesn't lock, as many times as you click it, is as many times as it breaks its former connection and makes a new one.
I can't believe even MS would do something that stupid!!! Since I learned about forms on Netscape, it never occured to me that this problem could exist until I saw it for myself.
I couldn't care less about DHTML or CSS "compliance" when IE can't even act like a simple web client correctly!!
Eric
I've always though of IE as being the 'weak link' BUT check out this post on MozillaZine about how RUS-CERT has critized Mozilla's security policy. Supposedly Mozilla doesn't issue regular patches/update/notices to users - security fixes are only incorperated into the 'latest' release ?!?!!
thanks to Lizard for this mirror:
http://edwards.furhome.net/
all html and xml examples should now work.
thanks again for all the offers for mirrors i've had.
dean edwardsThere are countless implementations that try to fix IE's lack of PNG transparency support, using AlphaImageLoader in some form.
However, none of them fully work; I've tried pretty much all of them and none of them will work with CSS or Javascript rollovers.
"All that's missing now, is a stylesheet that'll close all remaining security holes..."
You can make an ethernet adapter for that, which plugs in between your Windows machine and the network or cable modem. Simply take a standard CAT5 lead, cut it in half, and tape the ends shut. Then plug one half into the Windows computer, and the other half into the network.
Running XP SP1 w/ IE 6 SP 1. Been using FireFox since it was Phoenix 0.2 and hardly ever fire up IE anymore, though...
seriouslyexcited.net
You do not actually need an entirely different style sheet for IE browsers. You can easily have one style sheet that addresses the differences of Mozilla/Opera/IE.
:) In short, it's actually quite easy to have one style sheet work for multiple browsers, without having to do any sort of detection.
You can, for instance, use hacks to feed specific values to IE only: Star HTML Selector Bug [Edwardson Tan]
There are numerous other such hacks available which exploit browser-specific bugs. There are ways to force IE into using the correct box-model, for instance, among many other things.
CSS Filters [Dithered.com] is just one place you will find information on such hacks. I prefer to use the CSS-Only hacks, but here are listed some methods incorporating Java Script as well.
Best of all, mostly all of the very useful CSS hacks validate
With permission of Dean Edward, I have copied the IE7 information and src download to my webserver for mirroring purposes. http://opensource.worldhuman.net/mirror/IE7
http://edwards.furhome.net/IE7/
thanks anyway Casey