I had fun styling the hCalendar markup for the Berlin Web 2.0 Expo schedule. I based the CSS on what I had written the table of errata for DOM Scripting (which uses del and ins to indicate changes—a nice little dab of POSH). For the conference schedule, I added a little flourish for standards-compliant browsers by highlighting headers and cells on the same row with these declarations:
table.vcalendar tbody td:hover,
table.vcalendar tbody td:focus {
background-color: #ddd;
}
table.vcalendar tbody tr:hover th,
table.vcalendar tbody tr:focus th {
background-color: #678;
}
Gareth asked if he could use the same CSS for some hCalendar schedules he marked up:
- The Future of Mobile taking place in London right now and
- @media Ajax the two-day conference, also in London, next week.
I’m more than happy to share my style sheets. In fact, Brian suggested the CSS could be released under a Creative Commons licence. So that’s what I’ve done.
This CSS file is licensed under a Creative Commons attribution licence. If you use Dmitry Baranovskiy’s conference schedule creator to generate an hCalendar table, this CSS should style it nicely.
Of course, you might decide to write your own CSS. In that case, please consider also sharing it under a similar licence. It would be nice to gather together a whole range of possible style sheets for hCalendar schedules and list them on the microformats wiki.