cssvault - inspiring creativity

Microsoft has finally made Internet Explorer 8 Beta publicly available for download, and all I can say is: WTF?

First of all, IE8 can only be installed in Windows Vista SP1, XP SP2, 2008 Server, and 2003 Server SP2. Which leads me to think that this is nothing more than a business ploy to get people to upgrade their *cough* legal *cough* Microsoft OS.

Next, what happened to passing the ACID2 test? After bragging about this milestone months ago, it is still failing for some. The exact reason is still unclear, but this inconsistency is disappointing nonetheless.

Third, what about SVG support? The web community has been stuck with raster formats LONG ENOUGH! How much longer must we wait until we arrive at a standardized vector format?

Finally, let’s look at IE8’s “new and exciting” features:

Activities

Activities are contextual services to quickly access a service from any webpage. Users typically copy and paste from one webpage to another.

Kind of cool, but plugins / extensions / add-ons in Firefox do the trick just fine.

WebSlices

WebSlices is a new feature for websites to connect to their users by subscribing to content directly within a webpage. WebSlices behave just like feeds where clients can subscribe to get updates and notify the user of changes.

Again, sort of cool. I am all for microformats, but RSS feeds are already a standard across all modern browsers in different platforms including mobile, so I doubt web developers will want to develop widgets that will only work on IE8.

Every “feature” listed after Webslices is basically pointless or a replication of a Firefox, Safari, or Opera feature. It’s sort of like the marketing team had to try very hard to come up with something to sell IE8 with. Nothing “new” or “exciting” here.

Favorites Bar

In Internet Explorer 7, the Links bar provided users with one-click access to their favorite sites. The Links bar has undergone a complete makeover for Internet Explorer 8.

So basically, the team spent countless hours designing a new favorites bar that looks just like every other favorites / bookmarks toolbar and added a new menu item that saves favorites directly into the bar and called it a new feature.

This feature, for one, has really left me speechless.

Next!

Automatic Crash Recovery

Automatic Crash Recovery (ACR) is a feature of Windows®Internet Explorer® 8 that can help to prevent the loss of work and productivity in the unlikely event of the browser crashing or hanging. The ACR feature takes advantage of the Loosely-Coupled Internet Explorer feature to provide new crash recovery capabilities, such as tab recovery, which will minimize interruptions to users’ browsing sessions.

Finally IE8 gets a feature that has been in Firefox for AGES! I guess this is their way of admitting that their browser crashes all to often.

P.S. How long did the designers come up with such a cool name as “Automatic Crash Recovery”? If I were them I’d try to trademark that before someone else does.

Improved Phishing Filter

Internet Explorer 7 introduced the Phishing Filter, a feature which helps warn users when they visit a Phishing site. Phishing sites spoof a trusted legitimate site, with the goal of stealing the user’s personal or financial information. For Internet Explorer 8, we are building on the success of the Phishing Filter with a more comprehensive feature called the “Safety Filter.”

I can’t believe this made it to the “New and Exciting Features” list. The marketing team is really on a roll.

Activities, WebSlices, Favorites Bar, Automatic Crash Recovery, and now Safety Filter? What’s next, the Super Cool Browsing History Manager? Seriously who comes up with these names?! While renaming Phishing Filter to Safety Filter would prevent Grandpa Joe from getting a migraine while trying to imagine why he must bring a filter the next time he goes fishing, I must say that this only leads to more confusion.

It would have been much more intuitive if the Phishing Filter were moved as an option below the Security Filter, because the Security Filter does so much more than prevent phishing attacks. For one, there’s the group policy option for blocking unsafe sites, and two … well that’s just about it.

That’s really just about everything that there is with the new IE8 Beta. If this is any indication of what the final product is going to look like, then I guess we are better off without it. As far as web developers are concerned, it’s just another browser to produce hacks for. Speaking of looks, it looks exactly the same as IE7. At least the Mozilla Firefox team made the effort to come up with a new look in Firefox 3.

On a serious note, hard core developers may wish to take a look at the IE8 Beta 1 Whitepapers, which as of today appears to be central to a single new feature: Better AJAX Development. Hooray. Yeah I know I said this was a serious note. But really guys, WTF?

As a follow up to my recent article on CSS-only, tableless forms, do check out the CSS Form Garden, a gallery that showcases uniquely style forms utilizing the same forms technique.

I have long shunned ASP.Net for the ugly and ancient HTML code that it uses for rendering controls. Enter the CSS Friendly Control Adapters kit (CFCA?) for ASP.Net 2.0, which “… provides pre-built control adapters that you can easily use to generate CSS-friendly markup from some of the more commonly used ASP.NET controls …”

Started late 2006 as a Microsoft project, it was released *gasp* open-source and required a lot of extra steps to incorporate into a project. Frustrated by this, an independent developer, Brian DeMarzo, repackaged the code so that it compiled into a single DLL, thus the present form of CFCA.

Although the website pretty much lacks updates, the project is still alive, with the latest release dated Jan 25.

You may download the code here.

I have been receiving a couple of inquiries on how to create do CSS forms so let me direct you to Jeff Howden’s two year old CSS-Only, Table-less Forms article. Yes you heard me right folks: two years old! Yet it still displays properly on the newest browsers, which only shows how resilient the code is.

By now you must be wondering about the “almost perfect” part in the title. This is simply because the CSS code does not validate. The culprit? Of course, it’s IE again, with the JavaScript-in-CSS expression() hack.

Oh, and if you have questions or suggestions for articles, you may reach me via dennison [at] cssvault dot com

Have fun!

This technique uses CSS pseudo selectors to the drop cap effect without modifying the HTML code.

For the poor folks who use IE6, David Kaneka came up with a JavaScript (jQuery) based solution that we can use.

So go ahead and see how it’s done or check out the demo page.

CSS guru Eric Meyer has spent some time rethinking CSS reset and has come up with a new stylesheet:


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}


This will probably change but for those who are looking for a good, understandable CSS reset, this is a good start.

When HTML was invented one of the things that we designers and developers have to struggle with is implementing multicolumn layouts. Even creating elegant multicolumn lists that will behave the way you want it to can prove to be a very challenging task. This article sums it all up quite nicely while providing sample code along with techniques to start working with.

Until browsers support CSS 3 specifications, Web builders will need to rely on other techniques for creating multicolumn lists. Here’s a look at some of the techniques that work with today’s browsers.

CoolTips replaces regular browser tooltips with fully stylable tool tips. It uses lightweight and unobtrusive JavaScript to replace conventional web-browser tooltips.

CoolTips automagically gets contents from the title attribute by utilizing the Prototype JavaScript framework. It uses script.aculo.us for animation. Both frameworks will need to be initialized to for it to work.

Link: CoolTips homepage

Nothing can be more disappointing than discovering that all those hours you spent laboriously getting your website to display properly on Firefox and IE7 does not work on IE6. As developers we definitely need to have IE6 and IE7 running side by side on the same machine. That’s how I discovered Multiple IE.
(more…)

This problem has been around for ages, but it is an easy one to overlook. Internet Explorer does not expand the ' entity (part of XHTML 1.0 specifications) since it is an XML entity. So be very careful especially when using an HTML editor and use ' instead.

Here’s an example: