Notes:
Workaround of empty cells is required to keep the borders continuous in IE and Chrome. In complex structures it would become necessary even without IE, while on borderless structures they'd probably be waste. div.colspan>div>div{position:relative} is also required due to IE, so that inner wrapper-div in cell 4 goes over the border of it's cell. Double-wrapper is required since CSS-cells wont allow overflow, they stretch instead. In rowspan-structure, hidden cells must contain *something* (prefetably  ), or else content in cell 5 will vertically center in Firefox and Chrome. In some cases, a huge disadvantage is, that you must know the height beforehand, to be able to control the overflow's height. Also, with undefined cell-width, growing length in spanning cell causes it to grow in width as well, regardless of the need. IE and Chrome mainly squeezes left column "for fun", while Firefox just oddly pushes right column bigger while you add content that wraps into more lines (more lines = more unnecessary empty-space-padding). Same "unnecessary padding" is visible on all three browsers (example about that).