How to Style An Events Calendar in CSS
Most modern calendars mar the sweet simplicity of our lives by reminding us that each day that passes is the anniversary of some perfectly uninteresting event.
— OSCAR WILDE
ALTHOUGH THEY AREN'T COMMON, it's surprising just how useful events calendars can be on the Web. A personal site might use one to indicate when a web log was updated or to show important dates in history. Even more interesting, an organization or community could use a calendar to publicize upcoming and recurring events.
In this project, we'll look at the basic structure of Web-based calendars, explore ways to set the borders between days, and discuss how the days should be classed and identified to give us the most flexibility for later styling.
This time around, our project is to help a community-events organization of a local government get some useful calendars on the Web. These calendars will be generated by a database on the server, so we don't have to worry about anyone hand-coding the calendar. All we need to do is figure out what markup the scripts should produce based on our styling needs. After that's done, we'll take a small, simple calendar of days and mark it up so that it's easy to style. Then we'll tackle a larger, more detailed version of that calendar, which will force us to deal with text content within a given day.