Search code examples
htmlhtml-tablerow

How to add text into rowspan in the middle of the table


Can someone please tell me how, to insert data in a row? I just want to write something in these 2 rows: The red + are the cells in which i want to insert text. I tried many things but it always ended up building a new line. I would appreciate help :) enter image description here

My html code:

<!DOCTYPE html>
<html>
    <head>
        <title>HTML rowspan Attribute</title>
        <style>
            table, th, td {
                border: 1px solid black;
                border-collapse: collapse;
                padding: 6px;
            }
        </style>
    </head>

    <body style = "text-align:center">

        <table>
            <tr>
                <td>Ajay</td>
                <TD ROWSPAN="3">Bild1</TD> 
                <TD>Bananas</TD>
                
                <TD ROWSPAN="3">Bild2</TD>
                
            </tr>
            
            <tr>
                <td>Priya1</td>
            </tr>
            <tr>
                <td>Priya</td>
            </tr>
        </table>
        
    </body>
</html>             


Solution

  • You need to add data in second and third row, so you need to enter those data in second and third <tr> itself.

    Here it is

    table, th, td {
      border: 1px solid black;
      border-collapse: collapse;
      padding: 6px;
    }
    <table>
        <tr>
            <td>Ajay</td>
            <td ROWSPAN="3">Bild1</td> 
            <td>Bananas</td>
            <td ROWSPAN="3">Bild2</td>
        </tr>
        <tr>
            <td>Priya1</td>
            <td>Bananas</td>
        </tr>
        <tr>
            <td>Priya</td>
            <td>Bananas</td>
        </tr>
    </table>