How to make html table colspan

Question

+------------------------------------+
|        |         |   col3          |
| col1   | col2    |-----------------| 
|        |         |subcol1 | subcol2|
+------------------------------------+
| Value 1 | Value 2| Val1.1|Val1.2   |
|------------------------------------|
| Value 1 | Value 2| Val2.1|Val2.2   |
+------------------------------------+

How can I do it with html table? Can someone help me with that?

The page https://stackoverflow.com/questions/9830506/how-do-you-use-colspan-and-rowspan-in-html-tables answers — raviiii1, Mar 08 '18 at 12:54
Possible duplicate of [How do you use colspan and rowspan in HTML tables?](https://stackoverflow.com/questions/9830506/how-do-you-use-colspan-and-rowspan-in-html-tables) — ochs.tobi, Mar 08 '18 at 12:56
@ochs.tobi its not dublicate i still don't know how to do it — , Mar 08 '18 at 12:57
Its absolutely the same thing. You just have one column less and one row more that the accepted answer — ochs.tobi, Mar 08 '18 at 13:02
From my point of view its exactly the same thing as https://stackoverflow.com/questions/9830506/how-do-you-use-colspan-and-rowspan-in-html-tables — Yannick Huber, Mar 08 '18 at 14:51

score 1 · Answer 1 · answered Mar 08 '18 at 13:01

If you really want to use tables:

<html>
<head>
<style>
table, th, td {
    border: 1px black solid;
}
</style>
</head>
<body>

<table>
  <tr>
    <th rowspan='2'>col1</th>
    <th rowspan='2'>col2</th>
    <th colspan='2'>col3</th>
  </tr>
  <tr>
    <th>subcol1</th>
    <th>subcol2</th>
  </tr>
  <tr>
    <td>Value 1</td>
    <td>Value 2</td>
    <td>Val1.1</td>
    <td>Val1.2</td>
  </tr>
  <tr>
    <td>Value 1</td>
    <td>Value 2</td>
    <td>Val1.1</td>
    <td>Val1.2</td>
  </tr>
</table>

</body>
</html>

Mumrah81 · Accepted Answer · 2018-03-08T14:00:59.383

What you need to know is:

When i use colspan, i create x td in the same row, so i don't need to provide them

When i use rowspan, i create 1 td in the next x rows, so i don't need to provide them

<html>
<body>
    <table border="1">
        <tr>
            <td rowspan="2">col1</td>
            <td rowspan="2">col2</td>
            <td colspan="2">col3</td>
        </tr>
        <tr>
            <td>subcol1</td>
            <td>subcol2</td>
        </tr>
        <tr>
            <td>Value 1</td>
            <td>Value 2</td>
            <td>Val1.1</td>
            <td>Val1.2</td>
        </tr>
        <tr>
            <td>Value 1</td>
            <td>Value 2</td>
            <td>Val2.1</td>
            <td>Val2.2</td>
        </tr>
    </table>
</body>
</html>

How to make html table colspan

2 Answers2