结合colspan和rowpan的HTML表

Question

I'm trying to make a html table with the following layout:

+-------+---+
|       |   |
+-------+   +
|       |   |
+-----+-----+
|     |     |
+-----+-----+

I am using a colgroup to divide the entire table into 5% pieces, and then applying colspan and rowspan to combine some pieces together. So far, I've had no success. I am wondering if anyone could point me in the right direction. A table is needed to accommodate email styling possibilities.

EDIT: https://plnkr.co/edit/CHmiOuKpUlPsVJanLl7l?p=preview Code as requested

Answer 1

To get your exact colspan and rowspan you would have to do something like this:

<table>
  <tr>
    <td colspan="3"></td>
    <td rowspan="2"></td>
  </tr>
  <tr>
    <td colspan="3"></td>
  </tr>
  <tr>
    <td colspan="2"></td>
    <td colspan="2"></td>
  </tr>
</table>

Here's the code in action:

https://jsfiddle.net/npjkrb55/1/