Slashdot Mirror

According to their website, Maxthon is based on the IE engine, which leads me to believe that its rendering is equally broken (I'm especially thinking about the CSS box model, although there are other problems too).

Not that users will notice, since web designers are forced to support the most common browser out there anyway. But having seen demos such as Eric Meyer's Complex Spiral, I wonder about how many interesting designs we're missing out on because of this limitation...

Anyway, I use Firefox for many reasons, but yeah, speed is not one of them (I don't notice much of a difference in either direction, actually).

I've never even SEEN any of the above mentioned programs, but I have played with gimp, blender, and POV-Ray, enough to confirm my suspicions that while I can learn how to use the software's features, I have the artistic talent of a turnip. (sorry, turnips...) So I use my digital camera, and get friends to send me images from their travels around the world, frequent the NASA, US Fish and Wildlife department, and other free image sites, and use a shareware program for the Mac called GraphicConverter, for which registration cost $30. I don't think I've done too badly. My business clients like having photos from their building or location play a part in their website, and personal site clients love having their site decorated with personally significant "artwork". Fonts also play a large part in my work, I simply set up a test .html page and fiddle with the CSS, using the DigitalColorMeter utility included with OS X, until I'm happy with the colors and size, then use Grab, a screen capture utility included with OS X, to save the file (it only saves in .tiff format), and GraphicConverter to tweak it and save it in the format I want. I get a lot of ideas in layout from A List Apart and css/edge.

http://www.lemkesoft.de/en/index.htm
http://www.alistapart.com/
http://www.meyerweb.com/eric/css/edge/

Maybe I should write a tutorial. "Great Graphics On The Cheap".

Agreed, MeyerWeb is great. As is his Eric Meyer on CSS book and related site. Which isn't /.ed yet, shame on you...

S5 is a slide show format based entirely on XHTML, CSS, and JavaScript. With one file, you can run a complete slide show and have a printer-friendly version as well. The markup used for the slides is very simple, highly semantic, and completely accessible. Anyone with even a smidgen of familiarity with HTML or XHTML can look at the markup and figure out how to adapt it to their particular needs. Anyone familiar with CSS can create their own slide show theme. It's totally simple, and it's totally standards-driven.

As a bonus, its markup is compatible with the Opera Show Format, and S5 is engineered to be displayed using Opera Show when a presenation is run using Opera.

If you'd like to see S5 in action, go ahead and run through the introductory slide show (also available as an 95KB ZIP archive, the size of which is due to the presence of several images in the slide show). Feel free to try any of the features. For example, you can hit the space bar to advance to the next slide. Or use the right arrow, the down arrow, hit Return... any of these will work. The other features will be explained in, or else demonstrated by, the slide show itself.

If you like the general idea of S5 but don't like the theme used for the intorductory slide show, then fear not: there are already a number of themes available, and you can of course always create your own.

If you have a hankerin' to know more about how this system works, exactly, we have a few resources that might help.

• A Basic Primer in Using S5 pretty much what it sounds like.
• S5 Reference a full reference describing what markup is required, what is recommended, and what is optional in an S5 presentation file.
• Minimal S5 Structure a guide to the absolute bare minimum markup used in an S5 slide file.
• S5 File Map explains what files are where, and what each one does.
• S5 FAQ it may not answer all your questions, but it will answer the common ones. The uncommon ones you'll have to send in.

Please also visit the thanks and acknowledgments page, which lists the people who helped improve S5 beyond what I ever could have done myself.

S5 is a slide show format based entirely on XHTML, CSS, and JavaScript. With one file, you can run a complete slide show and have a printer-friendly version as well. The markup used for the slides is very simple, highly semantic, and completely accessible. Anyone with even a smidgen of familiarity with HTML or XHTML can look at the markup and figure out how to adapt it to their particular needs. Anyone familiar with CSS can create their own slide show theme. It's totally simple, and it's totally standards-driven.

As a bonus, its markup is compatible with the Opera Show Format, and S5 is engineered to be displayed using Opera Show when a presenation is run using Opera.

If you'd like to see S5 in action, go ahead and run through the introductory slide show (also available as an 95KB ZIP archive, the size of which is due to the presence of several images in the slide show). Feel free to try any of the features. For example, you can hit the space bar to advance to the next slide. Or use the right arrow, the down arrow, hit Return... any of these will work. The other features will be explained in, or else demonstrated by, the slide show itself.

If you like the general idea of S5 but don't like the theme used for the intorductory slide show, then fear not: there are already a number of themes available, and you can of course always create your own.

If you have a hankerin' to know more about how this system works, exactly, we have a few resources that might help.

• A Basic Primer in Using S5 pretty much what it sounds like.
• S5 Reference a full reference describing what markup is required, what is recommended, and what is optional in an S5 presentation file.
• Minimal S5 Structure a guide to the absolute bare minimum markup used in an S5 slide file.
• S5 File Map explains what files are where, and what each one does.
• S5 FAQ it may not answer all your questions, but it will answer the common ones. The uncommon ones you'll have to send in.

Please also visit the thanks and acknowledgments page, which lists the people who helped improve S5 beyond what I ever could have done myself.

S5 is a slide show format based entirely on XHTML, CSS, and JavaScript. With one file, you can run a complete slide show and have a printer-friendly version as well. The markup used for the slides is very simple, highly semantic, and completely accessible. Anyone with even a smidgen of familiarity with HTML or XHTML can look at the markup and figure out how to adapt it to their particular needs. Anyone familiar with CSS can create their own slide show theme. It's totally simple, and it's totally standards-driven.

As a bonus, its markup is compatible with the Opera Show Format, and S5 is engineered to be displayed using Opera Show when a presenation is run using Opera.

If you'd like to see S5 in action, go ahead and run through the introductory slide show (also available as an 95KB ZIP archive, the size of which is due to the presence of several images in the slide show). Feel free to try any of the features. For example, you can hit the space bar to advance to the next slide. Or use the right arrow, the down arrow, hit Return... any of these will work. The other features will be explained in, or else demonstrated by, the slide show itself.

If you like the general idea of S5 but don't like the theme used for the intorductory slide show, then fear not: there are already a number of themes available, and you can of course always create your own.

If you have a hankerin' to know more about how this system works, exactly, we have a few resources that might help.

• A Basic Primer in Using S5 pretty much what it sounds like.
• S5 Reference a full reference describing what markup is required, what is recommended, and what is optional in an S5 presentation file.
• Minimal S5 Structure a guide to the absolute bare minimum markup used in an S5 slide file.
• S5 File Map explains what files are where, and what each one does.
• S5 FAQ it may not answer all your questions, but it will answer the common ones. The uncommon ones you'll have to send in.

Please also visit the thanks and acknowledgments page, which lists the people who helped improve S5 beyond what I ever could have done myself.

S5 is a slide show format based entirely on XHTML, CSS, and JavaScript. With one file, you can run a complete slide show and have a printer-friendly version as well. The markup used for the slides is very simple, highly semantic, and completely accessible. Anyone with even a smidgen of familiarity with HTML or XHTML can look at the markup and figure out how to adapt it to their particular needs. Anyone familiar with CSS can create their own slide show theme. It's totally simple, and it's totally standards-driven.

As a bonus, its markup is compatible with the Opera Show Format, and S5 is engineered to be displayed using Opera Show when a presenation is run using Opera.

If you'd like to see S5 in action, go ahead and run through the introductory slide show (also available as an 95KB ZIP archive, the size of which is due to the presence of several images in the slide show). Feel free to try any of the features. For example, you can hit the space bar to advance to the next slide. Or use the right arrow, the down arrow, hit Return... any of these will work. The other features will be explained in, or else demonstrated by, the slide show itself.

If you like the general idea of S5 but don't like the theme used for the intorductory slide show, then fear not: there are already a number of themes available, and you can of course always create your own.

If you have a hankerin' to know more about how this system works, exactly, we have a few resources that might help.

• A Basic Primer in Using S5 pretty much what it sounds like.
• S5 Reference a full reference describing what markup is required, what is recommended, and what is optional in an S5 presentation file.
• Minimal S5 Structure a guide to the absolute bare minimum markup used in an S5 slide file.
• S5 File Map explains what files are where, and what each one does.
• S5 FAQ it may not answer all your questions, but it will answer the common ones. The uncommon ones you'll have to send in.

Please also visit the thanks and acknowledgments page, which lists the people who helped improve S5 beyond what I ever could have done myself.

S5 is a slide show format based entirely on XHTML, CSS, and JavaScript. With one file, you can run a complete slide show and have a printer-friendly version as well. The markup used for the slides is very simple, highly semantic, and completely accessible. Anyone with even a smidgen of familiarity with HTML or XHTML can look at the markup and figure out how to adapt it to their particular needs. Anyone familiar with CSS can create their own slide show theme. It's totally simple, and it's totally standards-driven.

As a bonus, its markup is compatible with the Opera Show Format, and S5 is engineered to be displayed using Opera Show when a presenation is run using Opera.

If you'd like to see S5 in action, go ahead and run through the introductory slide show (also available as an 95KB ZIP archive, the size of which is due to the presence of several images in the slide show). Feel free to try any of the features. For example, you can hit the space bar to advance to the next slide. Or use the right arrow, the down arrow, hit Return... any of these will work. The other features will be explained in, or else demonstrated by, the slide show itself.

If you like the general idea of S5 but don't like the theme used for the intorductory slide show, then fear not: there are already a number of themes available, and you can of course always create your own.

If you have a hankerin' to know more about how this system works, exactly, we have a few resources that might help.

• A Basic Primer in Using S5 pretty much what it sounds like.
• S5 Reference a full reference describing what markup is required, what is recommended, and what is optional in an S5 presentation file.
• Minimal S5 Structure a guide to the absolute bare minimum markup used in an S5 slide file.
• S5 File Map explains what files are where, and what each one does.
• S5 FAQ it may not answer all your questions, but it will answer the common ones. The uncommon ones you'll have to send in.

Please also visit the thanks and acknowledgments page, which lists the people who helped improve S5 beyond what I ever could have done myself.

S5 is a slide show format based entirely on XHTML, CSS, and JavaScript. With one file, you can run a complete slide show and have a printer-friendly version as well. The markup used for the slides is very simple, highly semantic, and completely accessible. Anyone with even a smidgen of familiarity with HTML or XHTML can look at the markup and figure out how to adapt it to their particular needs. Anyone familiar with CSS can create their own slide show theme. It's totally simple, and it's totally standards-driven.

As a bonus, its markup is compatible with the Opera Show Format, and S5 is engineered to be displayed using Opera Show when a presenation is run using Opera.

If you'd like to see S5 in action, go ahead and run through the introductory slide show (also available as an 95KB ZIP archive, the size of which is due to the presence of several images in the slide show). Feel free to try any of the features. For example, you can hit the space bar to advance to the next slide. Or use the right arrow, the down arrow, hit Return... any of these will work. The other features will be explained in, or else demonstrated by, the slide show itself.

If you like the general idea of S5 but don't like the theme used for the intorductory slide show, then fear not: there are already a number of themes available, and you can of course always create your own.

If you have a hankerin' to know more about how this system works, exactly, we have a few resources that might help.

• A Basic Primer in Using S5 pretty much what it sounds like.
• S5 Reference a full reference describing what markup is required, what is recommended, and what is optional in an S5 presentation file.
• Minimal S5 Structure a guide to the absolute bare minimum markup used in an S5 slide file.
• S5 File Map explains what files are where, and what each one does.
• S5 FAQ it may not answer all your questions, but it will answer the common ones. The uncommon ones you'll have to send in.

Please also visit the thanks and acknowledgments page, which lists the people who helped improve S5 beyond what I ever could have done myself.

S5 is a slide show format based entirely on XHTML, CSS, and JavaScript. With one file, you can run a complete slide show and have a printer-friendly version as well. The markup used for the slides is very simple, highly semantic, and completely accessible. Anyone with even a smidgen of familiarity with HTML or XHTML can look at the markup and figure out how to adapt it to their particular needs. Anyone familiar with CSS can create their own slide show theme. It's totally simple, and it's totally standards-driven.

As a bonus, its markup is compatible with the Opera Show Format, and S5 is engineered to be displayed using Opera Show when a presenation is run using Opera.

If you'd like to see S5 in action, go ahead and run through the introductory slide show (also available as an 95KB ZIP archive, the size of which is due to the presence of several images in the slide show). Feel free to try any of the features. For example, you can hit the space bar to advance to the next slide. Or use the right arrow, the down arrow, hit Return... any of these will work. The other features will be explained in, or else demonstrated by, the slide show itself.

If you like the general idea of S5 but don't like the theme used for the intorductory slide show, then fear not: there are already a number of themes available, and you can of course always create your own.

If you have a hankerin' to know more about how this system works, exactly, we have a few resources that might help.

• A Basic Primer in Using S5 pretty much what it sounds like.
• S5 Reference a full reference describing what markup is required, what is recommended, and what is optional in an S5 presentation file.
• Minimal S5 Structure a guide to the absolute bare minimum markup used in an S5 slide file.
• S5 File Map explains what files are where, and what each one does.
• S5 FAQ it may not answer all your questions, but it will answer the common ones. The uncommon ones you'll have to send in.

Please also visit the thanks and acknowledgments page, which lists the people who helped improve S5 beyond what I ever could have done myself.

S5 is a slide show format based entirely on XHTML, CSS, and JavaScript. With one file, you can run a complete slide show and have a printer-friendly version as well. The markup used for the slides is very simple, highly semantic, and completely accessible. Anyone with even a smidgen of familiarity with HTML or XHTML can look at the markup and figure out how to adapt it to their particular needs. Anyone familiar with CSS can create their own slide show theme. It's totally simple, and it's totally standards-driven.

As a bonus, its markup is compatible with the Opera Show Format, and S5 is engineered to be displayed using Opera Show when a presenation is run using Opera.

If you'd like to see S5 in action, go ahead and run through the introductory slide show (also available as an 95KB ZIP archive, the size of which is due to the presence of several images in the slide show). Feel free to try any of the features. For example, you can hit the space bar to advance to the next slide. Or use the right arrow, the down arrow, hit Return... any of these will work. The other features will be explained in, or else demonstrated by, the slide show itself.

If you like the general idea of S5 but don't like the theme used for the intorductory slide show, then fear not: there are already a number of themes available, and you can of course always create your own.

If you have a hankerin' to know more about how this system works, exactly, we have a few resources that might help.

• A Basic Primer in Using S5 pretty much what it sounds like.
• S5 Reference a full reference describing what markup is required, what is recommended, and what is optional in an S5 presentation file.
• Minimal S5 Structure a guide to the absolute bare minimum markup used in an S5 slide file.
• S5 File Map explains what files are where, and what each one does.
• S5 FAQ it may not answer all your questions, but it will answer the common ones. The uncommon ones you'll have to send in.

Please also visit the thanks and acknowledgments page, which lists the people who helped improve S5 beyond what I ever could have done myself.

S5 is a slide show format based entirely on XHTML, CSS, and JavaScript. With one file, you can run a complete slide show and have a printer-friendly version as well. The markup used for the slides is very simple, highly semantic, and completely accessible. Anyone with even a smidgen of familiarity with HTML or XHTML can look at the markup and figure out how to adapt it to their particular needs. Anyone familiar with CSS can create their own slide show theme. It's totally simple, and it's totally standards-driven.

As a bonus, its markup is compatible with the Opera Show Format, and S5 is engineered to be displayed using Opera Show when a presenation is run using Opera.

If you'd like to see S5 in action, go ahead and run through the introductory slide show (also available as an 95KB ZIP archive, the size of which is due to the presence of several images in the slide show). Feel free to try any of the features. For example, you can hit the space bar to advance to the next slide. Or use the right arrow, the down arrow, hit Return... any of these will work. The other features will be explained in, or else demonstrated by, the slide show itself.

If you like the general idea of S5 but don't like the theme used for the intorductory slide show, then fear not: there are already a number of themes available, and you can of course always create your own.

If you have a hankerin' to know more about how this system works, exactly, we have a few resources that might help.

• A Basic Primer in Using S5 pretty much what it sounds like.
• S5 Reference a full reference describing what markup is required, what is recommended, and what is optional in an S5 presentation file.
• Minimal S5 Structure a guide to the absolute bare minimum markup used in an S5 slide file.
• S5 File Map explains what files are where, and what each one does.
• S5 FAQ it may not answer all your questions, but it will answer the common ones. The uncommon ones you'll have to send in.

Please also visit the thanks and acknowledgments page, which lists the people who helped improve S5 beyond what I ever could have done myself.

"Also, some of my newer websites have a help window that pop-ups when you click on a question mark next to certain items"

Have a read about CSS tricks and dynamic HTML -- this very question came up on the HCI mailing list a week ago, and the consensus was that any sort of popup is an appalling idea, especially when it's so easy to display "help" callouts on the same page

Come on guys, this is so obviously propoganda. The guy spends a month trying to find a way to crash mozilla, when it took me 2 minutes on google to find a way to crash IE:

http://www.meyerweb.com/eric/thoughts/2004/09/14/t en-things-to-do-in-cleveland-before-youre-dead/

-ben

Yeah, Just so you're aware, Flash is actually well-standardized, and because there's a single canonical viewer, one of its great advantages is that you don't have to play vendor control games. Arguably, for complex layout, Flash is easier to work with than HTML, specifically because it is so singly standardized and implemented.

Now, I can't stand to work with it, so please don't think that I'm advocating it. But, Flash was publically standardized and released to the public for reimplementation in the middle of the lifespan of Flash 4. That's the reason for projects like Ming, and for Macromedia's competitors like Adobe to have begun to include the flash format in their own products all at the same time.

As far as open standard things that can do what Flash can do which browser vendors are implementing - other than Flash (which satisfies your criteria,) it's called SVG, and it's about halfway there. You guys haven't rushed to it at all, hence browser vendors' lackluster support. It's been around since 2001.

As far as working in Firefox but not in Mozilla, son, I hate to be the first to break it to you, but they're built from the same codebase.

I'd love to see an example of that; it defies what the Mozilla project seems to be. Did you bother to report it in Bugzilla? Did you tell anyone at irc.mozilla.org #mozillazine about it? Look, it's one thing not wanting to fix it yourself, but if the impossible is occurring, you might at least tell the project about it? I mean, trapsing through bugzilla there appears to be no such bug, and so the only person you have to blame for this not being fixed is yourself.

Anyway, when any one of you guys has to write a container, deal with polymorphism, handle large scale architectures, deal with interfaces across applications, write libraries for static or dynamic linking, then I'll manage to hold sympathy for a few two- and three-line HTML hacks which are already extremely well documented at places like The Noodle Incident, MeyerWeb, WaSP, Well-Styled, and so forth.

The things you're complaining about, even if they were as hard as you suggest, just aren't that hard. As an HTML novice but as a programmer I walked into an IRC channel, got a few good FAQ sites, read for an afternoon, and was able to write cross-browser sites afterwards. Go read Sutter's and Alexandrescu's papers about exceptions if you want to see short examples of what other people deal with silently.

Nobody makes more noise about fewer or smaller issues than the web programming community. Oh no, you have to preface a property illegally with an underscore. Shudder.

Accessibility doesn't always mean it looks right. You can have divs that overlap or just don't line up in various browsers. It works and reads fine, but it looks a little funny.

So the hacks and tweaks are typically fairly minor right now. We err on the side of IE, and maybe the width is off by 3 or 4 pixels (border width, sometimes) in Firefox. Font sizes are never quite perfect.

On the other extreme, check out Eric Meyer's pages on css/edge to see what I mean...

You can see the menus and select them just fine, but they're weird in IE. Check the complexspiral page - it doesn't even look LOATHSOME in IE, but it's just not proper enough for professional developers to accept it for a production page. Look at the slantastic one too, as well as the explanations.

The most frustrating thing is, it works the other way around. If it looks OK in IE and horrible (or even INACCESSIBLE) in anything else, everybody just shrugs their shoulders and says "Oh well, as long as they can read the content. They can just fire up IE." ...and my point ORIGINALLY was... just tell your boss, "Actually, a quarter of our visitors will see an ugly, broken page. Is that what you really want?" Then you actually have the OK to spend the time on not only writing to Firefox, but maybe even sneaking in some nice features that will only show up in Firefox (and be invisible to IE).

Good old Peter Blum - quality validators. While on the subject of .net improvements, don't forget to update the machine.config file so that .net doesn't detect uplevel browsers as downlevel and start outputting HTML 3.2. You can find a fairly good browsercaps file here: http://www.codeproject.com/aspnet/browsercaps.asp though there may be better resources around.

For CSS - I can recommend (In no particular order):
http://thenoodleincident.com/tutorials/css/
http://www.meyerweb.com/eric/css/edge/
http://www.positioniseverything.net/
http://www.s7u.co.uk/
http://alistapart.com/topics/css/

For CSS inspiration, go here: http://www.csszengarden.com/

But I would go for a book:
Designing with Web Standards, Jeffrey Zeldman (ISBN: 0735712018). Possibly also the Eric Meyer on CSS books too.

Enjoy.

IE has one thing that no other browser has: it shows almos Every Single Page as it was intended by the designers.

I'm really, seriously hard pressed to think of a page that looks good in IE but bad in Firefox right now... but it's easy to find pages that look good in Firefox but bad in IE. So, where does that leave your claim?

So, while MS does not respect W3C standards, the only way to compete with IE is being able to render the pages exactly like IE does.

Standard counterexample. The last thing I want is a browser that tries to render that exactly like IE does.

Every single web page I have ever written, I have spent at least a day struggling to get it to look right in IE, while it works perfectly in every other browser from the moment the first draft is complete.

Concerning CSS: This site should be a good example. With modern browsers you can have content and presentation separate and implement some cool effects (see "Complexspiral"). Gecko even allows you to build menus using nothing but CSS.
With IE, most of this just doesn't work. And it won't until at least 2006.

That would be kind of useful, if I wasn't currently drifting away from browser-handled bookmarks and instead using a customized start page using CSS-generated menus, in which you can fit anything from links to the Google search <form>.
hmm, that would be a nice feature - a start page generated from your bookmark folders, utilizing meta-bookmarks (which are in fact HTML snippets). Add customizable CSS and a name like about:start and I'd be sold.

And if you want to cram a learning algorithm into that, make the code that generates the start page sort the folders and bookmarks by how often you use them.

• glish
• Eric Meyer's CSS/edge
• Owen Brigg's Little Boxes
• Blue Robot's The Layout Reservoir
• CSS Zen Garden
• MezzoBlue

Why do they leave their CSS box model completely broken when it's obvious what needs fixing?

The box model has been fixed in IE6. Heck, that linked page looks better in IE6 than it does in Mozilla 1.7!

OTOH, this page doesn't render correctly in IE6 without serious hacking.

a 100% standards complient...

People who ask for this generally don't know the standards in question very well. Most standards is a hodge-podge of wish list features; the question is what subset are we going to support.

That said, PNG alpha transparenty and being able to render this page correctly would be nice.

sending of HTML email off by default in Outlook

Most email users prefer html email over text email. Probably because normal text looks ugly (I hate the courier font) in Windoze. Heck, even Evolution has support to HTML email. Yes, images is a privacy concern, but most users like seeing real smileys in their email.

changes to how Internet Explorer handles MIME types to ignore the extention and content of the file and to treat what the server or email message says the MIME type is as gosepel. If there is none, fallback on file extentions and stuff. Also, enhance windows handling so that mime types can be associated with different handlers. (this eliminates any need to use the file extention to determine what handler to use for it)

This is an ease-of-use issue; I don't like it myself, but can see why Microsoft doesn't expect an average person with a personal web page to deal with /etc/mime.types in oder to get their web page to look nice. But, yes, I hate going to a web page in Mozilla and seeing a bunch of HTML tages instead of the rendered page.

Most UNIX web servers are broken that, when the MIME type is unknown, they send out text/plain instead of something like application/unknown or what not.

- Sam

Here is the classic example of a web page that doesn't render in IE7.

OK, visit this site: The complex Spiral.

This site looks ugly in IE6.

And, please name the sites that don't render "correctly" in Firefox 0.9/Mozilla 1.7 but render "correctly" in IE.

I like IE. . . I never have to worry about sites not working correctly.

Really?

Are you sure?

I think you're wrong.

I like IE. . . I never have to worry about sites not working correctly.

Really?

Are you sure?

I think you're wrong.

I like IE. . . I never have to worry about sites not working correctly.

Really?

Are you sure?

I think you're wrong.

For everything I've seen, Firefox supports CSS much better than IE. Like a sibling said, IE has become the bane of CSS, hindering true development in a number of ways. Entire websites are devoted to making CSS compliant sites work with IE, not Firefox.

Observe:

1. css/edge
2. glish.com : CSS layout techniques
3. Flash of Unstyled Content (FOUC)
4. The Layout Reservoir - BlueRobot

How do you do that with HTTP?

Well, you could do it with CSS

--Nick

I hope that there becomes enough viable competition to IE that MIcrosoft feels more motivated to keep up with the latest web standards. the complex spiral looks fine in a year-old release of Mozilla, but still looks like junk in IE.

That's the recommended CSS link order so that the link specificity works logically (in other words, so that the CSS acts as you think it would).

If you have lots of flexibility and varied experience that you want to demonstrate, I recommend modeling your resume after this college entrance essay: http://www.meyerweb.com/other/humor/application.ht ml

That's a bug alright, and unfortunately a longstanding one. I'm curious though? What type of effect are you trying to create by this kind of positioning with respects to form controls?

Personally I find it odd, that you would favor IE when creating complex (or even simple) CSS layout - personally I find IE lacking and frustrating in so many areas. Try taking a look at this site for example. There are some serious IE CSS positioning bugs discussed here which I can't imagine you haven't encountered? Some are misinterpretations of the W3C specs, and others just exhibit unexplainable behaviour. There are workarounds for some of them, but not all of them will leave you with valid markup. There are also some Mozilla position bugs explained there, though I don't know whether they have been fixed in the meantime.

Another classic IE CSS1 bug as shown by the Complexspiral demo.

I remember an interesting story here on slashdot about how Microsoft winning the browser war stopped the innovation with IE. Think about it? How old is IE now? This MSDN document about the CSS enhancements (box model implementation) in IE 6 is dated march 2001. That's ages ago, and now CSS2.1 - if I'm not mistaken - is the current recommendation with CSS3 around the corner. When is the IE 7 due? 2006? 2007?

A lot of other browsers like Mozilla and Opera are much more up to date, with respects to CSS, and at least with one of these browsers you can file a bug, and see it getting proper treatment and being fixed in the end.

"MS IE is not CSS compliant"

Which version?

Version 6.0 (The latest.)

MS was obviously aware that 5.0 wasn't up to spec. So they patched it.

Yes, and it's still not up to spec.

They did obviously fix the problems

No, they obviously did not.

1. Code to Any Browser.
2. Code to Internet Explorer.
3. Code to The Mozilla Engine.

4. Basically, the Any Browser campaign says to write everything to HTML 4.01 "Strict". Use CSS for all layout. Mozilla development fits this very nicely. Check out Eric Meyer's CSS/EDGE. Everything at CSS/Edge fits with the "AnyBrowser" way of doing things, but yet not everything at CSS/Edge will load with Internet Explorer.

   In my own less complex pages, I've found that I can make a page load /similarly/ in both, but I can't use HTML "Strict", unless Internet Explorer starts to choke (throwing everything to the left edge when I wanted it centered, etc.).

   So, as the above post mentioned, you end up writing to Internet Explorer, but you loose compatability with some "text readers for the blind", lynx, etc.

   Ah, but who cares if a blind person can read your web page. Well, maybe your web page isn't just a collection of photos, maybe you have something of interest. Then, you should care.

   Bottom line, the user will think that you're web page is broken if it doesn't load in I.E., and you loose readers this way. So, you end up with a web page that is a little more sparse, and less feature rich than you wanted.

1. Code to Any Browser.
2. Code to Internet Explorer.
3. Code to The Mozilla Engine.

4. Basically, the Any Browser campaign says to write everything to HTML 4.01 "Strict". Use CSS for all layout. Mozilla development fits this very nicely. Check out Eric Meyer's CSS/EDGE. Everything at CSS/Edge fits with the "AnyBrowser" way of doing things, but yet not everything at CSS/Edge will load with Internet Explorer.

   In my own less complex pages, I've found that I can make a page load /similarly/ in both, but I can't use HTML "Strict", unless Internet Explorer starts to choke (throwing everything to the left edge when I wanted it centered, etc.).

   So, as the above post mentioned, you end up writing to Internet Explorer, but you loose compatability with some "text readers for the blind", lynx, etc.

   Ah, but who cares if a blind person can read your web page. Well, maybe your web page isn't just a collection of photos, maybe you have something of interest. Then, you should care.

   Bottom line, the user will think that you're web page is broken if it doesn't load in I.E., and you loose readers this way. So, you end up with a web page that is a little more sparse, and less feature rich than you wanted.

• Design Graphics Magazine I'm not sure if it's still in print, but it's Australian, so they might give pointers to some user groups of interest in your area
• CSS Tutorial by W3Schools Something to get you started on CSS
• A List Apart, articles on doing tricky things with CSS
• Eric Meyer's writings. Links to articles and such by the author of ORA's CSS: The Definitive Guide. [read the Web Review articles from 2000 for some of the real power of CSS]
• Learning CSS a list of books and online resources
• Westciv courses on-line courses on CSS, CSS2 and some free resources.

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.

And what's more, it doesn't even fully support CSS1, which was released in 1996! Try the ComplexSpiral demo, which is a neat demo of the effects possible in Mozilla, Opera and Safari with the 'background-attachment:' CSS1 property, which IE supports only on the BODY tag. Also, let's add 'position: static' support onto our wishlist (for watermarks/menus on pages) and PNG alpha support, and a whole bevy of regular CSS rendering bugs that have remained unsolved for years. MS claims "full CSS1 compliance", but in reality they only support the reduced CSS1 core spec.

And to think it'll be a wait of several years before IE is updated with Longhorn... until then, writing pure CSS sites is going to remain a bug-whacking chore. Let's all be collectively glad that MS fought so hard for their "Freedom to Innovate" back in the anti-trust days ;).

P.S. redesign slashdot using modern web standards, editors!

I know this is not perfect, but you can't call it a hack, since it's perfectly regular CSS.

Regarding the non-rectangular : overhere

Regards,
jdifool

Go take a look there

The problem you conjure up can already be tackled with pure CSS...

Hope it will help.

Regards,
jdif

Yep, that's a neat trick, and there are others

css/edge

This site showcases some amazing stuff, all done with standard HTML and CSS. No Javascript, no (specific browser)-only code. That doesn't mean it works in all browsers, as the different versions of IE have varying bugs and/or missing implementations. This site is flat-out proof that the internet doesn't need the majority of proprietary code that sites use. The fact of the matter is that in most cases, the author used the easy way (auto-generated proprietary code) as opposed to the right way.

Demo and Demo-IE are a good example. IE does get it mostly right, but not quite. On the complexspiral pages, you can see again that IE doesn't do the background image the way it's supposed to.

This is a great site. It's 100% standards-compliant (i.e. it follows the rules set up to ensure proper operation of the web), does some neat visual stuff, and points out IE's flaws all at once.

css/edge

This site showcases some amazing stuff, all done with standard HTML and CSS. No Javascript, no (specific browser)-only code. That doesn't mean it works in all browsers, as the different versions of IE have varying bugs and/or missing implementations. This site is flat-out proof that the internet doesn't need the majority of proprietary code that sites use. The fact of the matter is that in most cases, the author used the easy way (auto-generated proprietary code) as opposed to the right way.

Demo and Demo-IE are a good example. IE does get it mostly right, but not quite. On the complexspiral pages, you can see again that IE doesn't do the background image the way it's supposed to.

This is a great site. It's 100% standards-compliant (i.e. it follows the rules set up to ensure proper operation of the web), does some neat visual stuff, and points out IE's flaws all at once.

css/edge

This site showcases some amazing stuff, all done with standard HTML and CSS. No Javascript, no (specific browser)-only code. That doesn't mean it works in all browsers, as the different versions of IE have varying bugs and/or missing implementations. This site is flat-out proof that the internet doesn't need the majority of proprietary code that sites use. The fact of the matter is that in most cases, the author used the easy way (auto-generated proprietary code) as opposed to the right way.

Demo and Demo-IE are a good example. IE does get it mostly right, but not quite. On the complexspiral pages, you can see again that IE doesn't do the background image the way it's supposed to.

This is a great site. It's 100% standards-compliant (i.e. it follows the rules set up to ensure proper operation of the web), does some neat visual stuff, and points out IE's flaws all at once.

Its so simple, it works without JavaScript, loads faster, cross-browser compatible, and if the user is running a non-graphical browser, it's still accessible. Here's a quick example (where somepic.png contains both roll over states, one at (0, 0) and the other at (0, 20):

a.Foo {
display: block;
width: 100;
height: 20;
background: url("somepic.png") top left no-repeat;
}

If you start throwing out examples, it would be nice to check that those work. You've a mistake there as "width:100;" or "height:20;" mean nothing. You have to define the unit unless the value you're trying to set is zero. Yep, they work in MSIE, but when did that browser knew anything about the standards? The correct format is width: 100px and height: 20px .

After saying that, yes, for simple roll-overs and cascading menus, the CSS is much better choice than javascript. Javascript should be used when the functionality required is much more complex.

Its so simple, it works without JavaScript, loads faster, cross-browser compatible, and if the user is running a non-graphical browser, it's still accessible. Here's a quick example (where somepic.png contains both roll over states, one at (0, 0) and the other at (0, 20):

a.Foo {
display: block;
width: 100;
height: 20;
background: url("somepic.png") top left no-repeat;
}

If you start throwing out examples, it would be nice to check that those work. You've a mistake there as "width:100;" or "height:20;" mean nothing. You have to define the unit unless the value you're trying to set is zero. Yep, they work in MSIE, but when did that browser knew anything about the standards? The correct format is width: 100px and height: 20px .

After saying that, yes, for simple roll-overs and cascading menus, the CSS is much better choice than javascript. Javascript should be used when the functionality required is much more complex.

What would also be nice is a working implementation of the css background-attachment. Eric Meyer's complex spiral demo, which looks kick-ass, renders horribly broken in IE6, and there's no way to fix it. This is unlike the PNG support, where at least you can use the HTC hack to use the directx plugin to render transparent png's loaded from img tags (no solution though for png's loaded from css).

Anyway, I've stopped trying to make pretty designs that show up correctly in IE. I make sure it's usable in IE, but if something looks "off", I don't give a damn. But then I only have that luxury because I'm not a professional web designer.

While HTA is simpler than XUL, there is also the case of XAML
which is the direct mirror (or maybe crazy carnival-mirror) of XUL. Last in the blog someone points out that all these attributes was good at the level of HTML 1.0 but is bad, bad, bad if you are going to make any serious applications out of it. CSS is the way to handle such things, unless of course you have an integrated visual developing program that generates code all over the place. Then it all makes sense, because it will become a pain in the *ss to convert the random attributes into some coherent pattern or transform it to for example XUL. (not that XUL don't have some attributes itself)

Eric Meyer explains why it's a bad thing, even though it might look appealing at first sight.