Unexpected behaviour when with HTML Table rowspan -
i creating dynamic table generator, , during testing, found following generated html gives unexpected layout in browsers (firefox, chrome, ie)
<table> <tr> <td rowspan="2"></td> <td></td> </tr> <tr> <td rowspan="2"></td> </tr> <tr> <td></td> </tr> </table>
i expecting 2x3 table, top corner merged left cell in middle row, , and middle row right cell merged bottom right cell instead ended 2x2 grid
side note, if provided height on css or row/cell attribute; doesn't change layout of resulting table.
p/s don't intend use layouts; idiot proof codes unintended effects weird layouts such this
edit:
expected:
|------|-------| | | | | | | | |-------| | | | | | | |------| | | | | | | | |------|-------|
result:
|------|-------| | | | | | | |------|-------| | | | | | | |------|-------|
edit 2: added css
table { border: 2px solid #000000; padding: 10px; } td { border: 2px solid #ff0000; height: 100px; width: 100px; padding: 10px; } tr { border: 2px solid #00ff00; padding: 10px }
i tried:
<table> <tr> <td rowspan="2" style="border: 1px solid #ff0000; height:200px"></td> <td style="border: 1px solid #ff0000; height:100px"></td> </tr> <tr> <td rowspan="2" style="border: 1px solid #ff0000; height:200px"></td> </tr> <tr> <td style="border: 1px solid #ff0000; height:100px"></td> </tr> </table>
Comments
Post a Comment