If you were programming a calendar in HTML would you use Table tags or Div tags?

Question

I converted my company's calendar to XSL and changed all the tables to divs. It worked pretty well, but I had a lot of 8 day week bugs to work out initially owing to precarious cross-browser spacing issues . but I was reading another post regarding when to use tables v. divs and the consensus seemed to be that you should only use divs for true divisions between parts of the webpage, and only use tables for tabular data.

I'm not sure I could even have used tables with XSL but I wanted to follow up that discussion of Divs and Tables with a discussion of the ideal way to make a web calendars and maybe a union of the two.

Answer 1

I would say that a calendar is a table, therefore making the table the proper markup for its representation.

Edit: Definition 11 for "table" from answers.com says:

An orderly arrangement of data, especially one in which the data are arranged in columns and rows in an essentially rectangular form.

Answer 2

A calendar is the perfect reason to use a table! Calendars inherently present tabular data and HTML tables are good at presenting tabular data. And HTML table markup provides nearly all the CSS hooks you need to associate CSS selectors with various parts of the table to dress it up.

I'm all for using DIVs for layout--but stick with tables for tabular data.

Here is a cool article on how to dress up tables with CSS: http://www.smashingmagazine.com/2008/08/13/top-10-css-table-designs

Answer 3

Tables are for displaying tabular data. So I would say is ideal.

Answer 4

I think this is definitely a case for using tables. The biggest issue when using divs would be box height for each individual day. If you're styling each box with a border, they could look off if the content for one day is longer than another. The additional markup to make it look right would be more than it would take to create it with a table, so I don't think divs are worth the extra effort in this case.

Answer 5

It makes sense to use tables, but if you were to look at Google Calender, they seem to be using div tags. It is possible that using div tags lowers the file size, so in an enterprise environment it might be worth the 'trouble'.

Answer 6

Do it up in a table.

Also don't think of it as "divs vs. tables" Think of it as tables vs. a proper semantic tag with meaning. When I author pages I try to use divs as little as possible, in a lot of cases you could be using a paragraph, a list item, etc.

Answer 7

You might also consider an ordered list (weeks) of ordered lists (days), or simply one ordered list (days).

There are others who agree that the list approach is a good one.

Others prefer tables.

Answer 8

Just came across this thread after posing the same question elsewhere. While I completely agree a calendar is more of a tabular representation of data, I think there's truth in the prolific "it depends" answers. For example, I want to show a floating DIV popup when each day in the calendar is moused over. Using a table, the popup flickers as the cursor moves across the calendar since the popup is only active on the cell border and the day number in the cell itself. Using DIVs, the popup is solid (no flicker) the entire time the cursor mouses over the calendar cell.