www.webdeveloper.com
Results 1 to 6 of 6

Thread: How to use Numbered Lists inside HTML tables

  1. #1
    Join Date
    Feb 2010
    Posts
    3

    How to use Numbered Lists inside HTML tables

    Difficulty using Ordered Lists in HTML tables

    I can't figure out how to use Ordered Lists inside HTML tables.
    The following is an Ordered List Outside of any HTML table:
    1. Decimal type
    2. Tea
    3. Coca Cola
    The Ordered List above is perfect, i.e., exactly what I want, when the list is outside of a table.

    I can't figure out a way to keep the Ordered List numbering working (as shown above) when the Ordered List appears inside a table, as shown in the pdf file at this url:
    "http://www.theadhdsolution.net/publicmisc/Difficulty%20using%20Ordered%20Lists%20in%20HTML%20tables.docx.pdf[^]"

    I need the numbering to continue from the Left cell in the first row (in the table in the pdf) to the Left cell in the second row (in the pdf), to the left cell in the 3d row (in the pdf).

    Someone told me that there's a rule somewhere in the W3c specs saying that Ordered List nuimbering cannot work across cells (from one cell to another) in a table. If that's true:
    1. I'd love to know where to find that rule; I've been looking for it for a while; and
    2. I'm hoping that someone will know of some alternate method for making sequential numbers appear in tables.

    Thanks,

    BarryNu


    <html>
    <head>
    <title>My HTML application</title>
    <HTA:APPLICATION
    APPLICATIONNAME="My HTML application"
    ID="MyHTMLapplication"
    VERSION="1.0"/>
    </style>
    </head>
    <script language="VBScript">
    Sub Window_OnLoad 'This method will be called when the application loads 'Add your code hereEnd Sub
    </script>
    <font size ="4"><b><u>My Outline-Numbering Wish List</b></u>
    <br>
    <ol>
    <li>Decimal type</li>
    <li>Tea</li>
    <li>Coca Cola</li>
    </ol>
    <br>
    <br>
    <table cellspacing=1 cellpadding=3 bgcolor="black">
    <tr>
    <td bgcolor="white">
    <ol><li>Decimal type</li>
    </td>
    <td bgcolor="white">
    Right Column </td>
    </tr></ol>
    <td bgcolor="white">
    <ol><li>Tea<br><-- I wish that that the "1" could be replaced with a "2"</li>
    </td>
    <td bgcolor="white">
    Right Column </td>
    </tr></ol>
    <td bgcolor="white">
    <ol><li>Coca Cola<br><-- I wish that that the "1" could be replaced with a "3"</li>
    </td>
    <td bgcolor="white">
    Right Column </td>
    </tr></ol>
    </table>
    <br>
    <table cellspacing=1 cellpadding=3 bgcolor="black">
    <tr>
    <td bgcolor="white">
    <ol>
    <li>First One</li>
    </td>
    <td bgcolor="white">
    <li><-- I wish that that were a "2"</li>
    </td>
    </tr>
    <tr>
    <td bgcolor="white">
    <li><-- I wish that that were a "3"</li>
    </td>
    <td bgcolor="white">
    <li>Whoops. One too many</li>
    </td>
    </tr>
    </table></ol>
    </body>
    </html>

  2. #2
    Join Date
    Jan 2005
    Location
    Frankfort, KY, USA
    Posts
    6,167
    I suggest using some javascript or server-side coding that simply counts and assigns numbers to the table rows, and then writes that number in the HTML.
    FYI
    * My screen resolution is set at 1680x1050
    * I'm accessing your site through a T1 line
    * I'm probably viewing it using Firefox (unless browser is specified)

  3. #3
    Join Date
    Feb 2010
    Posts
    3

    Smile Server-side scripting to write number into cells, Numbered Lists inside HTML tables

    Thank you. Very helpful suggestion. Much appreciated.


    BarryNu

  4. #4
    Join Date
    Jul 2009
    Posts
    184
    Here is a simple javascript function that will show the Row number and an element from an array in the cell beside it. It could be changed to suit your purposes.

    Code:
    <script type="text/javascript">
    function html_table(my_array)
           {
           // Generate table head
           document.write('<table border="1"><thead><th>Row and Array Value</th></thead>');
           for(var row = 0; row < my_array.length; row++)
           {
           // Generate table rows and information
           document.write('<tr>');
           document.write('<td>' + (row+1) + ". " + my_array[row] + '</td>');
           document.write('</tr>');
           }
           document.write('</table>');
           }
           
           var my_array = ["Decimal Type", "Tea", "Coca Cola"];
           
           html_table(my_array);
    </script>

  5. #5
    Join Date
    Feb 2010
    Posts
    3

    Smile Javascript

    thank you. Very very much appreciated.


    BarryNu

  6. #6
    Join Date
    Feb 2010
    Posts
    11
    Hi!
    I'm beginner in html-language, than I can't to give you correctly answer to your question.
    So I can give you advice to use this html tutorials resource to improve your knowledges by html language!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles