Simple (I hope), HTML question.
Let's say I have a column group that spans 3 columns. But it also spans 9 rows. But in actuality, I want there to be 3 levels of columns (so basically, 3 columns, split across 9 rows). The only objectives really are:
a) avoid embedding tables (for various reasons) b) keep the sections modular. c) allow for styling of the semantically modular areas.
So in the end, I would have something visually like:
| col 1 | col 2 | col 3 |
| row 1 | row 1 | row 1 |
| row 2 | row 2 | row 2 |
| row 3 | row 3 | row 3 |
| col 4 | col 5 | col 6 |
| row 4 | row 4 | row 4 |
| row 5 | row 5 | row 5 |
| row 6 | row 6 | row 6 |
| col 7 | col 2 | col 3 |
| row 7 | row 7 | row 7 |
| row 8 | row 8 | row 8 |
| row 9 | row 9 | row 9 |
I was able to get the column groups to work to keep the 3 columns together, but an attempt to add "rowspan" failed.Trying to wrap the row groups in tr tags was no good at all. and as far as i an tell, there is no real "rowgroup" tag.
Update:
After getting feedback, I realized I should give more details on what I have in mind.
I'll use the term quad, super-column, super-row to refer to groups of data. So take this example:
Quad 1 Quad 2
super-row1 | a | b | c || d | e | f |
super-row2 | 1 | 2 | 3 || 4 | 5 | 6 |
super-row3 | A | B | C || D | E | F |
Quad 3 Quad 4
super-row4 | g | h | i || j | k | l |
super-row5 | 7 | 8 | 9 || 0 | 1 | 2 |
super-row6 | G | H | I || J | K | L |
For simplicity sake, just imagine that across the top I wrote super-col 1 - 6.
So, the data in quad 1 is all related, and the data in super-row 1 is all related, and the data in super-col 1 is all related. So, using the above data,
'a' has a direct relationship with 'f', 'C', and 'G', but 'f', 'C', and 'G' have no direct relationship with each other.
Another way of thinking about it is Sudoku, where each quad, column, and row contain the set of 1-9, making any of the 81 data points related directly to any other data points it shares a row, column, or quad with, but not to any data points.
Quick update:
One last thing, sorry. It's important that these relationships be grouped semantically in the HTML so that, should someone be using a screen reader or non-traditional browser, they can know where they are in the table at any given point, ie "You are in Quad 1, Super Col 1, Column 4, Super Row 1, Row 1. The data is 'Ohio'."
This makes styling, cross-browser compatibility, accessibility all much easier, as well as an moving around such as AccessKeys, Scope, etc.