sign in | join about | help | sitemap
Connecting Tech Pros Worldwide
lawrence's Avatar

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>
3 Answers Posted
Tim's Avatar
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's Avatar
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's Avatar
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 <!-- comments --> 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.
 
Not the answer you were looking for? Post your question . . .
196,803 members ready to help you find a solution.
Join Bytes.com

What is Bytes?

We are a network of experts and professionals in IT and software development that help one another with answers to tough questions and share insights. Get the best answers to your questions from over 196,803 network members.
Post your question now . . .
It's fast and it's free

Popular Articles

Top Community Contributors