I need to create a simple 2x4 table. However, the first row (table title) should be one cell and the second row four cells. How can I make the first cell span all the four columns?
| Table Title |
________________| <- row 1 has one big cell
________________| <- row 2 has four cells
I CANNOT use <table>, and other html tags. Everything should be pure CSS.
I successfully created simple tables with display:table, display:cell, and display:row CSS attributes. However, I do not know how to overcome the lack of column span property.
The term "pure CSS" is a misnomer. A stylesheet by itself is useless. You need some structure, often [X]HTML, for the styles to be applied to.
You could put the "header row" outside of the element with display:table.
FYI, IE5-7 don't support display:table, display:table-row, or display:table-cell.