Progressive Enhancement

Instead of going through 1 by 1 and doing various progressive enhancement techniques I can do it all in one for your viewing pleasure. If you are in a completely awesome browser, pretty much any latest release non-IE browser, you should see most if not all of the progressive enhancements. In this example I use multi-column, transitions (CSS animations), transforms (rotation, scaling etc), custom fonts (@font-face), drop shadows on text and containers (text-shadow & box-shadow), rounded corners (border-radius), transparency (rgba), multiple backgrounds, media queries, custom selection colours (::selection) and finally gradients. Pretty comprihensive list that covers most of the major CSS3 features.

Click me to reveal information

Using a combination of media queries, css transitions and the :target pseudo class we can create an accordion effect that will animate the showing and hiding in webkit based browsers.