CLOSE

HTML Tables: Nesting Tables

HTML nested tables are another convenient way to store lots of information in small spaces. Below is an example of a table with another nested inside.

<table border="1" cellpadding="10">
    <tr>
        <td rowspan="2">

        Table 1 Col 1 Rowspan 2 with Nested Table 
            <table border="1">
                <tr>
                    
                    <td>Table 2 Row 1 Col 1</td>
                    <td>Table 2 Row 1 Col 2</td>
                    
                </tr>
                <tr>
                    
                    <td>Table 2 Row 2 Col 1</td>
                    <td>Table 2 Row 2 Col 2</td>
                    
                </tr>
            </table>
        </td>
        <td>Table 1 Row 1 Col 2</td>
        <td>Table 1 Row 1 Col 3</td>
    </tr>
    <tr>
        <td>Table 1 Row 2 Col 2</td>
        <td>Table 1 Row 2 Col 3</td>
    </tr>
</table>
Expand

You'll notice we've added another attribute: cellpadding to our parent table. This is to give each cell in the table some padding.

Share This Tutorial

Link To This Tutorial

Tutorial URL
https://stepbystephtml.com/tutorial/15/html-beginner-tutorial

HTML Link

Help Us to Help You

This website and it's tutorials are only made possible with your support. Support money goes towards keeping our servers online.

Amount

Link to Us

Spread the word! Let people know about our tutorials by placing links on blogs, websites, forums and other places.

HTML Link

Copyright 2019 Step By Step HTML. All Rights reserved.