Today is a Beautiful Day

mikmik · #1 (**permalink**) 04-20-2004, 06:37 AM

http://dean.edwards.name/IE7/overview/

I had to blink twice when I saw this.

I went looking for yet another hack to repair a positioning discrepancy between those two arch rivals - IE6 and IE5.5!

I followed a new link from a favourite CSS resource page of mine, CSS Vault, a good place to find cutting edge leads.

I saw a reference to ..IE7???

I go to the above dean.edwards.name site. Then I wipe my eyes, get some fresh air and look again. It still says this on my moniter

Quote:

overview
IE7 invokes a DHTML behavior to load and parse all style sheets into a form that Explorer can understand. You can then use most CSS2 selectors without having to resort to CSS hacks.

The behavior is lightweight and is automatically loaded via a CSS inclusion. No alteration of your original document is necessary. Nor do you have to alter your CSS.

IE7 provides Microsoft Internet Explorer with support for W3C standard CSS.

It supports the following CSS selectors:

namespace|selector
parent > child
adjacent + sibling
[attr], [attr="value"], [attr~="value"]
.multiple.classes (fixes bug)
:first-child, :last-child
:hover, :active, :focus
:root

Works with both HTML and XML documents

Supports imported style sheets

Preserves the cascade of the style sheet

Does not alter the document structure

Does not repeatedly query the DOM tree using JavaScript

It uses pure CSS to enforce style sheet rules

Works for Microsoft Internet Explorer 5.5+

last modified: 2004/04/14

So, I have stumbled upon the ANSWER? Someone has brought the future of CSS compliant coding two years or so early?

I tried it, because It was what I was working on, of course.

It worked.

It took some fiddling with a slight misnaming of the path to the file (what a melodramatic geek !!!) - There are a couple of bases still to cover, but all it took was putting this:

Quote:

into the head of my page. The site I'm doing has some wierd script on it, and would not work with a DTD. Now it does.
I have to go back over all the measurements I used because now there are gaps and misalignments because IE is rendering the box model properly.
Not only that, you can use all the min and max widths like they are meant to be used, and IE doesn't crash when you resize the browser window any more!!!!

Pinch me, I must be dreaming :o)

YEE-ESSSS!

mikmik · #2 (**permalink**) 04-20-2004, 06:43 AM

I just found this, it has been out for a month. The guy serves his site from a computer in his kitchen LOL

Quote:

This is potencialy the biggest achievement that will benefit CSS-oriented users. Simply amazing.

Posted by: Aleksandar Vacic at March 7, 2004 06:13 AM

http://www.cssvault.com/hacks/ie7.php

JayDrake · #3 (**permalink**) 04-22-2004, 02:15 PM

Thanks for posting that! I'll be sure to jump on it and see what I can do with this. (Eric Meyer's Complex Spiral demo comes to mind...) If this is half of what I hope it to be, I'm going to be weeping for joy tonight when I get a chance to play with it.

mikmik · #4 (**permalink**) 04-22-2004, 04:47 PM

Hi, Jay. I downloaded the zip with all the files and working demo's from here http://dean.edwards.name/IE7/

I am realizing now that 'alpha' release is about what this is, as it seems to work good in simpler pages quite well, but on pages where the DOM, or cascade is third or more generation, I can't see a difference.
Also, the "Moz behaviors" example is giving me errors in Firefox, I forgot to look closely and can't remember (24 hrs ago haha) if it was a runtime or syntax error, pretty sure the latter, on line 40.

I am just to busy to really check this out good and try some debuging, I can't even write a javascript myself yet!, but I have the .htc kit from MSDN and want to have a good look.

I was following links, and got to a Czech page where a guy is doing the same work.
The examples of png alpha transparency and max/min width (and height) look very nice there, also.

I used the Svend Tofte code (home page) http://www.svendtofte.com/

Quote:

<html>
<style>
p {
border:1px solid red;
max-width:30em;
width:expression(
document.body.clientWidth > (500/12) *
parseInt(document.body.currentStyle.fontSize)?
"30em":
"auto" );
}
</style>
<body>

[alot of text]
</p>
</body>
</html>

I got that on his demo page but when I used it in a simple ONE column layout ie header, content, footer, - with a content box only, centered with right and left margins, I had problems with IE locking up. I did also have a simple tree view nested list on the page with

Quote:

in the head also, so it wasn't a pure aplication.
Course these aren't much good if the CSS2 behaviors don't work with other objects and script.

It never fails to amaze me how demos can work perfectly, no matter how simple or complicated the example, on the author's site, or even downloaded, but as soon as I cut'n'paste the exact script, then add anything else, they don't work! All code, php, perl but mostly, of course, dhtml!

I got the original IE7 link here CSS Vault

Oops :o), my mistake, he is Hungarian, here is the other site
Webes technológiák and this is his version (beta) of behaviors htc.
The links to all his demonstrations are on the first page (check out ie-blink.htc, now flashing websites can become even more obnoxious ha) and it is possible to make sense of it because even though he writes in Hungarian, code is almost always in English.

Write on, JayDrake, thanks for your support and interest.

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode