Welcome to WebmasterWorld Guest from 54.221.28.179

Forum Moderators: incrediBILL

Message Too Old, No Replies

How to do nested ul-lists that validate and look ok?

     

the_nerd

8:05 am on Dec 6, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hi,

now that I try and please W3's validator all my nested menus are broken. Maybe someone can lend me a hand?

I used to nest my menus like this:

ul
li/
li/
ul
li/
li/
/ul
/ul

That doesn't validate, although it's easy to format.

so now I did it in a correct (think so) way:

ul
li/
li/
li ul
li/
li/
/ul /li
/ul

w3 likes it, but the li that's nested around the inner ul always brings in a new line (or spacing or whatever) before the inner list.

How do I get the list to look "right"?

Thanks, nerd

SuzyUK

8:57 am on Dec 6, 2006 (gmt 0)

WebmasterWorld Senior Member suzyuk is a WebmasterWorld Top Contributor of All Time 10+ Year Member



>> (or spacing or whatever)

shouldn't be, however the <li> that you're nesting the child ul in should have it's usual other content (blue text below), you shouldn't need an extra list element for the sole purpose of nesting a UL in, the sample below has no gaps

<ul>
<li>list item one</li>
<li>list item two
<ul>
<li>nested list item one</li>
</ul>
</li>
<li>list item 3</li>
</ul>

or alternatively is there any CSS rules applied to the list that could be affecting the new nest?

Suzy

the_nerd

9:38 am on Dec 6, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Suzy,

thanks for your help. I had hoped to be able to post this "uhhhm sorry I figured it out now ...." before you came and nailed me ;-)

While looking for an answer I found this: [css.maxdesign.com.au...] (it's linked from w3.net, so I thought it's ok to mention here)

nerd

 

Featured Threads

Hot Threads This Week

Hot Threads This Month