position: absolute - Design resources and inspiration.

Well, after a painful 6 year wait between IE6 and IE7, it’s refreshing to see a first version of IE8 already available for download. Developers can go crazy testing the new and improved CSS 2.1 compatibility, and a bunch of other things most people probably won’t need (but they’re probably nice to have none-the-less). As expected, SVG support is still missing, but at least the browser may finally be catching up on the basic standards. For one thing, they are dropping the hasLayout issues according to this article.

Let us all rejoice: Microsoft has changed their mind on a earlier issue, and IE8 will use Standards mode by default instead of requiring a meta tag. At debate was their idea that we should add a special meta tag to our HTML to activate their new “really, really real” standards mode, in order to preserve backwards-compatibility with broken websites based on their old, buggy browsers. Of course, this sent a storm through the standards-loving blogosphere.

Microsoft’s new enlightenment is very, very significant news for web developers and the future of web standards and it’s amazing that they actually listened to developers. Get more info straight from the lion’s mouth.

Today is a good day. :)

(Thanks, neckCNS)

Ever since the releases of the Web Developer and Firebug extensions in Firefox, things in the world of CSS and HTML work have become a lot easier. Sadly, a lot of what will work in almost all browsers still massively messes up in Internet Explorer. Knowing a few things about IE like hasLayout helps a lot, but sometimes even those fixes don’t work and you’re left trying out every conceivable hack known to man. Wouldn’t it be great to have something like Firebug in IE? Apparently Jean-Fabrice Rabaute thought so too, so he’s releasing DebugBar 5. Someone give this man a cigar.

Max Design asks the question that I keep asking myself: “What are definition lists? When are they appropriate?” and then explains how to style them to look like tables, image galleries, calendar of events and more.

That’s a long title for such a simple thing. Left Logic has the last HTML Entity Character Lookup you’ll ever need. No more scrolling through entity lists looking for a tiny bit of code just to type a simple character. Search for entity characters based on how they look. So if you need some sort of dash, type a regular minus sign and you’ll get everything that even slightly looks like it. Need something that resembles a P? Good, type a p and you’re set (see screenshot above). It’s fast, and couldn’t be more intuitive. Available also as a OS X dashboard widget, Firefox extension and search plugin.
(Thanks for the tip, Jochen)

SWFUpload is a flash-powered file-upload widget intended to replace the regular HTML file-upload form element. In their own words, SWFUpload is “a small javascript/flash library to get the best of both worlds – The great upload capabilities of flash and the accessibility and ease of html/css”. SWFUpload offers a number of usability and styling features the standard html version can’t offer, and for those who don’t have Flash/Javascript, SWFUpload degrades gracefully.

Update 2008-11-22: It appears SWFUpload has moved to a new domain in the meantime: www.swfupload.org. Thanks to readers Kooshal and Jigna for letting us know.

Test how your website will appear on the iPhone, in the (supposedly) pixel-perfect iPhone emulator, iPhoney. The iPhoney features the original iPhone-Safari browser interface, and can be rotated to view in landscape mode. So you can go ahead and test a few of those iPhone applications that are already springing up. Mac-only, for now.

Campaign Monitor, one of the largest online services for newsletter management and deployment, has written up a new edition of the definitive guide to CSS support in e-mails. If you create newsletters, I recommend reading this, as Microsoft has managed to set back HTML e-mail by several years thanks to Outlook 2007. This info should prove very useful as a time and sanity saver.

Yup, you read correctly. It’s CSS Naked Day, where sites all across the intarwebs drop their pants and go nude for a day. The point? To promote web standards, proper markup and a clean semantic structure of content. And since we’re firm believers in all of that, position: absolute is joining in on the fun. You’ll note that position: absolute is still completely accessible without all the pretty pixels, and that pretty much sums up why web standards are a Good Thing^TM. Text/Braille readers and search engines see it this way pretty much every day.

Our stylesheets are now getting a long deserved back rub, having a few drinks and catching up on the latest episodes of Scrubs. They’ll be back tomorrow, so until then, have a look around and let us know how it went!

Update 2007-04-06: And we’re back to full style glory!

Here’s a quick little something you may not have known about CSS borders.
(more…)