UL in LI in UL in LI - follow up to nesting multiple elements inside of UL

Question posted by: lawrence (Guest) on July 23rd, 2005 11:38 PM

This is a follow up question to the conversation that started here:

http://groups.google.com/groups?hl=...ng.google .com

I tried nesting all my links in lists in UL's that were in a UL. I
hate the result for its lack of consistency. Any design tips?

How can I had headlines to my lists?

<div id="design">
<ul>
<li><h7>Designs</h7></li>
<li><a href="mcControlPanel.php?arrangement=createdesignsForm.p hp">Create</a>
</li>
<li><a href="mcControlPanel.php?arrangement=makedefaultdesignsF orm.php">Make
default?</a> </li>
<li><a href="mcControlPanel.php?arrangement=deletedesignsForm.p hp">Delete</a>
</li>
<li>How many in trash? <?php
elementsAdminShowCountOfType("designs-delete", "trashItemsList"); ?>
</li>

<li><h7>Style Sheets</h7></li>
<li>
<ul>
<li><a href="mcControlPanel.php?arrangement=createstyleSheetsFo rm.php">Create</a>
</li>
<li><a href="mcControlPanel.php?arrangement=editstyleSheetsList .php">Edit</a>
</li>
<li><a href="mcControlPanel.php?arrangement=deletestyleSheetsFo rm.php">Delete</a>
</li>
<li>How many in trash? <?php
elementsAdminShowCountOfType("styleSheets-delete", "trashItemsList");
?> </li>
<li>How many old versions? <?php
elementsAdminShowCountOfType("styleSheets-oldVersion",
"editstyleSheetsOldVersionList"); ?></li>
</ul>
</li>

<li><h7>Templates</h7></li>
<li>
<uL>
<li><a href="mcControlPanel.php?arrangement=createtemplatesForm .php">Create</a>
</li>
<li><a href="mcControlPanel.php?arrangement=edittemplatesList.p hp">Edit</a>
</li>
<li><a href="mcControlPanel.php?arrangement=deletetemplatesForm .php">Delete</a>
</li>
<li><a href="mcControlPanel.php?arrangement=makedefaulttemplate sForm.php">Change
Default</a> </li>
<li><a href="mcControlPanel.php?arrangement=edittemplatesOldVer sionList.php">See
old versions</a> </li>
<li>How many in trash? <?php
elementsAdminShowCountOfType("templates-delete", "trashItemsList"); ?>
</li>
<li>How many old versions? <?php
elementsAdminShowCountOfType("templates-oldVersion",
"edittemplatesOldVersionList"); ?>
</ul>
</li>

<li><h7>Arrangements</h7></li>
<li>
<ul>
<li><a href="mcControlPanel.php?arrangement=createpublicArrange mentsForm.php">Create</a>
</li>
<li><a href="mcControlPanel.php?arrangement=editpublicArrangeme ntsList.php">Edit</a>
</li>
<li><a href="mcControlPanel.php?arrangement=deletepublicArrange mentsForm.php">Delete</a>
</li>
</ul>
</li>
</ul>

<h3>Control Panel</h3>
<ul>
<li><h7>Style Sheets</h7></li>
<li>
<ul>
<li><a href="mcControlPanel.php?arrangement=createcontrolPanelS tyleSheetsForm.php">Create</a>
</li>
<li><a href="mcControlPanel.php?arrangement=editcontrolPanelSty leSheetsList.php">Edit</a>
</li>
<li><a href="mcControlPanel.php?arrangement=deletecontrolPanelS tyleSheetsForm.php">Delete</a>
</li>
</ul>
</li>

<li><h7>Templates</h7></li>
<li>
<ul>
<li><a href="mcControlPanel.php?arrangement=createcontrolPanelT emplatesForm.php">Create</a>
</li>
<li><a href="mcControlPanel.php?arrangement=editcontrolPanelTem platesList.php">Edit</a>
</li>
<li><a href="mcControlPanel.php?arrangement=deletecontrolPanelT emplatesForm.php">Delete</a>
</li>
</ul>
</li>

<li><h7>Arrangements</h7></li>
<ul>
<li><a href="mcControlPanel.php?arrangement=createcontrolPanelA rrangementsForm.php">Create</a>
</li>
<li><a href="mcControlPanel.php?arrangement=editcontrolPanelArr angementsList.php">Edit</a>
</li>
<li><a href="mcControlPanel.php?arrangement=deletecontrolPanelA rrangementsForm.php">Delete</a>
</li>
</ul>

<li><h7>Imports</h7></li>
<li><a href="mcControlPanel.php?arrangement=importDesigns.php">Import
designs, templates, style sheets</a>

<li><h7>Elements</h7></li>
<li>
<ul>
<li><a href="mcControlPanel.php?arrangement=listAllElements.php ">List
all elements</a>
<li><a href="mcControlPanel.php?arrangement=listAllShowCommands .php">List
all 'show' commands</a>
</ul>
</li>
</ul>
</div>

Quote | Subscribe

Tim July 23rd, 2005 11:38 PM

Guest - n/a Posts

#2: Re: UL in LI in UL in LI - follow up to nesting multiple elements inside of UL

On 5 Nov 2004 14:09:12 -0800,
Join Bytes! (lawrence) posted:
[color=blue]
> This is a follow up question to the conversation that started here:
>
> http://groups.google.com/groups?hl=...ng.google .com
>
>
> I tried nesting all my links in lists in UL's that were in a UL. I
> hate the result for its lack of consistency. Any design tips?
>
> How can I had headlines to my lists?[/color]

Uggh, nasty big example to read through... Here's a quick synopsis of how
to do that sort of thing (below). You should be able to see that a whole
subsection goes inside a list item (heading and the sub-list together).
This keeps the headings with the list, rather than separates them.

<h1>Lots of lists</h1>

<ul>
<li>
<h2>First sub-section</h2>
<ul>
<li><a href="">link</a></li>
<li><a href="">link</a></li>
<li><a href="">link</a></li>
</ul>
</li>

<li>
<h2>Second sub-section</h2>
<ul>
<li><a href="">link</a></li>
<li><a href="">link</a></li>
<li><a href="">link</a></li>
</ul>
</li>
</ul>

Rendering something like:

Lots of lists

* First sub-section
o link
o link
o link

* Second sub-section
o link
o link
o link

And you can play with style rules so that nested lists get a different
style of bullet point, if you really want to make it obvious what's a
sub-item.

e.g. Something like this:
ul {list-style-type: disc;}
ul ul {list-style-type: circle;}

Though some browsers do that automatically, anyway.

--
If you insist on e-mailing me, use the reply-to address (it's real but
temporary). But please reply to the group, like you're supposed to.

This message was sent without a virus, please delete some files yourself.

lawrence July 23rd, 2005 11:45 PM

Guest - n/a Posts

#3: Re: UL in LI in UL in LI - follow up to nesting multiple elements inside of UL

Tim <tim@mail.localhost.invalid> wrote in message news:<1muuexjzyutg3.j70nzh2zyyfs$.dlg@40tude.net>...[color=blue]
> On 5 Nov 2004 14:09:12 -0800,
> Join Bytes! (lawrence) posted:
>[color=green]
> > This is a follow up question to the conversation that started here:
> >
> > http://groups.google.com/groups?hl=...ng.google .com
> >
> >
> > I tried nesting all my links in lists in UL's that were in a UL. I
> > hate the result for its lack of consistency. Any design tips?
> >
> > How can I had headlines to my lists?[/color]
>
> Uggh, nasty big example to read through... Here's a quick synopsis of how
> to do that sort of thing (below). You should be able to see that a whole
> subsection goes inside a list item (heading and the sub-list together).
> This keeps the headings with the list, rather than separates them.[/color]

Great idea. That's how I've done things then. I guess I was stuck
thinking only one thing could go in LI, but really anything can.

Tim July 23rd, 2005 11:46 PM

Guest - n/a Posts

#4: Re: UL in LI in UL in LI - follow up to nesting multiple elements inside of UL

Tim <tim@mail.localhost.invalid> wrote
[color=blue][color=green]
>> Uggh, nasty big example to read through... Here's a quick synopsis of how
>> to do that sort of thing (below). You should be able to see that a whole
>> subsection goes inside a list item (heading and the sub-list together).
>> This keeps the headings with the list, rather than separates them.[/color][/color]

Join Bytes! (lawrence) posted:
[color=blue]
> Great idea. That's how I've done things then. I guess I was stuck
> thinking only one thing could go in LI, but really anything can.[/color]

*Almost* anything can go inside (I haven't checked, but I'm sure there's a
few things that shouldn't - like <li> <li>blah</li> </li>), as long as it's
*sensible* to be included as part of a list, it's probably okay.

Directly inside OLs and ULs, though, you can only put LI elements, anything
else you want in a list has to go inside the LI elements. Well, you can
put  outside of the LI elements, but I'm referring to
other HTML elements *must* go inside of an LI.

--
If you insist on e-mailing me, use the reply-to address (it's real but
temporary). But please reply to the group, like you're supposed to.

This message was sent without a virus, please delete some files yourself.

UL in LI in UL in LI - follow up to nesting multiple elements inside of UL

What is Bytes?

Popular Articles

Top Community Contributors