List Based Calendar v2

Skip all the fancy words and jump straight to the calendar


I came across Matt McInerney's list-based calendar, which I thought was pretty cool, although I'm not sure a calendar strictly speaking is a list.

I did however see some small room for improvement, so I began playing around with it. Some of the changes I made were:

  1. Converted the layout to be em-based instead of px-based
  2. Small semantic changes (span converted to p etc.)
  3. I made the style switcher work for users with javascript disabled - and through the browsers menu (if supported)
  4. Minor graphical change (day changes color on mouseover
  5. Made sure that the page validates
Switch layout
Calendar View
List/Agenda View

The calendar

January 2008


Obviously this calendar isn't perfect:

If you liked this, go ahead and Digg it or add it to

Maybe you will also like my demo page of CSS Selectors and Pseudo Selectors?