How to use list item in table cells using html?

user_15019628 0
Viewed 37

How to use the ordered list in a table, in which each cell will define a list item. like This picture.

There's to way to define the column first. So I tried to make something like this. (This is not what I need. I just tried something because I had no clue to do something like the first picture.)

With this Html code:

    <table cellspacing="0" border="1">
        <ol type="1">
            <tr>
                <th>Heading 1</th>
                <td>
                    <li> data</li>
                </td> 
                <td>
                    <li> data</li>
                </td> 
                <td>
                    <li> data </li>
                </td>
            </tr>
        </ol>

        <ul type="square">
            <tr>
                <th>Heading 2</th>
                <td>
                    <li> data</li>
                </td>
                <td>
                    <li> data</li>
                </td> 
                <td>
                    <li> data </li>
                </td>
            </tr>
        </ul>

        <ol type="A">
            <tr>
                <th>Heading 3</th>
                <td>
                    <li> data</li>
                </td> 
                <td>
                    <li> data </li>
                </td>
                <td>
                    <li> data </li>
                </td>
            </tr>
        </ol>
    </table>

Now I'm confused, how can I use <li> of an ordered or unordered list in each cell to make it as a list view?

html-table list html
1 Answers

You can do either this, else nothing.

       <table cellspacing="0" border="1">
            <tr>
                <th>Heading 1</th>
                <th>Heading 2</th>
                <th>Heading 3</th>
            </tr>

            
            <tr>
                <td>
                    <ol type="1" start="1">
                        <li>
                            Data
                        </li>
                    </ol>
                </td> 
                <td>
                    <ul type="square">
                        <li>
                            Data
                        </li>
                    </ul>
                </td>
                <td>
                    <ol type="A" start="1">
                        <li>
                            Data
                        </li>
                    </ol>
                </td>
            </tr>

            <tr>
                <td>
                    <ol type="1" start="2">
                        <li>
                            Data
                        </li>
                    </ol>
                </td> 
                <td>
                    <ul type="square">
                        <li>
                            Data
                        </li>
                    </ul>
                </td>
                <td>
                    <ol type="A" start="2">
                        <li>
                            Data
                        </li>
                    </ol>
                </td>
            </tr>

            <tr>
                <td>
                    <ol type="1" start="3">
                        <li>
                            Data
                        </li>
                    </ol>
                </td> 
                <td>
                    <ul type="square">
                        <li>
                            Data
                        </li>
                    </ul>
                </td>
                <td>
                    <ol type="A" start="3">
                        <li>
                            Data
                        </li>
                    </ol>
                </td>
            </tr>
        </table>

user_143018640
Related