<!DOCTYPE html> <html> <head> <meta charset=utf-8> <style> table { margin: 10px; border: 8px solid silver; border-right-color: #666; border-bottom-color: #333; border-spacing: 5px; border-collapse: collapse; writing-mode: vertical-rl; } td { border: 4px solid black; height: 50px; width: 20px; text-align: center; } td.w1 { height: 80px; } td.w2 { height: 120px; } tr:nth-child(even) { background: #ffc; } tr:nth-child(odd) { background: #cff; } tr:nth-child(1) { background: #fcf; width: 50px; } </style> </head> <body> <table> <tr><td colspan=3> </td> <td> </td> </tr> <tr><td rowspan=3> </td><td class="w1"> </td><td> </td><td> </td> </tr> <tr> <td> </td> <td> </td><td rowspan=2> </td> </tr> <tr> <td> </td> <td> </td> </tr> <tr><td> </td> <td> </td> <td> </td><td class="w2"> </td></tr> </table> </body> </html>