Metaninja

While teaching myself more about what's new in HTML5 and CSS3, I developed this little exercise to see what's possible now in CSS3.

The floating box on the right is composed entirely of CSS3 properties; no images were used.

It works great in Chrome and Safari (although the text looks very jaggy in Safari on Windows), works pretty well on FireFox 3.5 or higher (except for the background gradient property which Firefox doesn't support; I had to use a solid color instead), works fairly well in IE9 Preview (no box shadows or text shadows; come on IE team, please add all the CSS3 visual effects that Webkit currently supports before you ship it), and utterly fails in Internet Explorer 8 or older.

Sigh.

Still, it's an exciting time to be a web designer. I, for one, welcome our CSS3 overlords.

Just a fun random experiment using the Park Avenue Shift color scheme by b_wiebe from Kuler.