Table markup using HTML - html

Question

I need to make markup for creating the next table (using HTML):
task
Here is my way of making that (doesn't work):
Step 1: Making "general" markup with all cells of equal size:
td { border: solid #aaa 1px }
<table>
<thead>
<tr>
<th colspan="4">Some Table</th>
</tr>
</thead>
<tbody>
<tr>
<td>1.1</td>
<td>1.2</td>
<td>1.3</td>
<td>1.4</td>
</tr>
<tr>
<td>2.1</td>
<td>2.2</td>
<td>2.3</td>
<td>2.4</td>
</tr>
<tr>
<td>3.1</td>
<td>3.2</td>
<td>3.3</td>
<td>3.4</td>
</tr>
</tbody>
</table>
Output: Step 1
Step 2: Using "colspan" and "rowspan" for making cells 1.3 and 2.1 bigger and deleting unnecessary cells (1.4, 2.3, 2.4, 3.3 and 3.4), except one (2.2 , just for now): Step 2
Step 3: As soon as I delete cell 2.2 - big cells (1.3 and 2.1) become "smaller": Step 3 and it isn't what I need...
Here is my final markup:
td { border: solid #aaa 1px }
<table>
<thead>
<tr>
<th colspan="4">Some Table</th>
</tr>
</thead>
<tbody>
<tr>
<td>1.1</td>
<td>1.2</td>
<td colspan="2" rowspan="2">1.3</td>
</tr>
<tr>
<td colspan="2" rowspan="2">2.1</td>
</tr>
<tr>
<td>3.1</td>
<td>3.2</td>
</tr>
</tbody>
</table>
I can't find out how to delete cell 2.2 and keep table's shape as it mentioned in the task... Appreciate any help.

Answer 1

Here is we Achieve the Output
table,
tr,
td {
border: 1px solid black;
}
table {
border-collapse: collapse;
}
tr {
height: 30px;
}
td {
height: 30px;
width: 50px;
text-align: center;
}
<table>
<tr>
<td>1.1</td>
<td>1.2</td>
<td colspan="2" rowspan=2>1.3</td>
</tr>
<tr>
<td colspan="2" rowspan="2">2.1</td>
</tr>
<tr>
<td>3.1</td>
<td>3.2</td>
</tr>
</table>

Answer 2

You should try to this code
td {
border: 1px solid #579;
}
<table>
<tbody>
<tr>
<td>1.1</td>
<td>1.2</td>
<td colspan="2">1.3</td>
</tr>
<tr>
<td colspan="2" rowspan="2">2.1</td>
<td>2.2</td>
<td>2.3</td>
</tr>
<tr>
<td>3.1</td>
<td>3.2</td>
</tr>
</tbody>
</table>

Answer 3

You should try this
<style>td{border:1px solid black;}
tr{height:35px;}
</style>
<table>
<tbody>
<tr>
<td colspan="4">Head</td>
</tr>
<tr>
<td>1.1</td>
<td>1.2</td>
<td colspan="2" rowspan="2">1.3</td>
</tr>
<tr>
<td colspan="2" rowspan="2">2</td>
</tr>
<tr>
<td>3.1</td>
<td>3.2</td>
</tr>
</tbody>
</table>