Jump to content

Multi-Level HTML Ordered Lists


epp_b

Recommended Posts

I want to know if the following is possible using <ol> and <li> tags (and CSS??)

1.  This is level one   1.1  This is level one one       1.1.1  This is level one one one       1.1.2  This is level one one two   1.2  This is level one two   1.3  This is level one three2.  This is level two   2.1  This is level two one

and so forth...

Link to comment
Share on other sites

<ol>  <li>This is level one    <ol>      <li>This is level one one        <ol>          <li>This is level one one one</li>          <li>This is level one one two</li>        </ol>      </li>      <li>This is level one two </li>      <li>This is level one three </li>    </ol>  </li>  <li>This is level two    <ol>      <li>This is level two one  </li>    </ol>  </li></ol>

Something like that? I will check to see if CSS will give you the numbering scheme you want.

Link to comment
Share on other sites

By default, browsers number the items in ordered lists beginning with the Arabic numeral 1, nested or not. It would be great if the standards numbered nested ordered lists in some rational, consecutive manner. For example, the items in the second nest of the third main ordered list might be successively numbered "3.2.1," "3.2.2," "3.2.3," and so on.
HTML & XHTML: The Definitive Guide, Musciano & Kennedy
Link to comment
Share on other sites

The best you could do is these three CSS rules:

ol{list-style-type:upper-alpha;}ol li ol {list-style-type:decimal;}ol li ol li ol {list-style-type:lower-alpha;}

This gives you:

A.   1.      a.      b.   2.   3.B.   1.

Link to comment
Share on other sites

Yeah, I figured that's as far as I could go. Thanks anyway.Peachy, that can more easily be done with the (somewhat depreciated) TYPE attribute.

Link to comment
Share on other sites

Yeah, I figured that's as far as I could go.  Thanks anyway.Peachy, that can more easily be done with the (somewhat depreciated) TYPE attribute.
True,But if you are writing valid XHTML you need to use CSS. And besides, I rather write 3 CSS rules then have to edit a kazillion lines of type=" attributes.... :whistling:
Link to comment
Share on other sites

Hello,Have a look here and here.I have tried counters myself, but with no success; my guess is that they are not supported by the current browsers.If you can work it out, however, please let us know!Cheers!

Link to comment
Share on other sites

Yeah, I figured that's as far as I could go.  Thanks anyway.Peachy, that can more easily be done with the (somewhat depreciated) TYPE attribute.
True,But if you are writing valid XHTML you need to use CSS. And besides, I rather write 3 CSS rules then have to edit a kazillion lines of type=" attributes.... :thumbsup:
That's what Search & Replace is for :thumbsup:
Link to comment
Share on other sites

True. :thumbsup: However, the smaller your page size, the more cost savings you will make if you have hosting provider that charges by the bandwidth, i.e., they charge you for the amount of data that gets downloaded from your web site. That might not be an issue for us, but if you have a commercial site and you use a commercial hosting provider, they give you so much megabytes a month of web traffic and then start metering the bandwidth if you go beyond it. So, if all of a sudden your site increases its traffic by 50% and your average page is say 100 kilobytes you could easily break that threshold whereas if your average page was only 3 kilobytes it wouldn't be significant. :thumbsup:

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...