how to do nested lists
in [CSS]
|
Prev: Shrink-to-fit width calculation: preferred width question
Next: International Conference WWW/Internet 2010: 1st call extension until 25 June 2010
From: coltrane on 13 Jun 2010 23:45 On 6/13/2010 9:16 PM, Thomas 'PointedEars' Lahn wrote: > coltrane wrote: > >> using: >> ul {list-style-type:circle} >> ul li ul {list-style-type: square;} >> >> <body> >> <div> >> <ul> >> <li>Item one</li> >> <li> >> <ul> >> <li>Sub Item One</li> >> </ul> >> </li> >> <li>Item two</li> >> <li>Item three</li> >> </ul> >> </div> >> </body> >> >> This does not work > > "Does not work" is a useless error description. It works for me with > several user agents (even though it is not semantical¹). BTW, you can lose > the `li' in the selector; in Valid (X)HTML markup, a UL/ul element must have > at least one child LI/li element, so that is implied. > > ¹ A semantical nested list as for a menu would be > > <ul> > <li>Item one > <ul> > <li>Sub Item One</li> > </ul> > </li> > <li>Item two</li> > <li>Item three</li> > </ul> > > as Adrienne already indicated. > >> and from the little, very little, I know it should. > > And it does, if these code blocks are part of Valid markup. The parent > `div' element is superfluous, BTW. > >> Sorry about the typo and the formatting. > > ACK(nowledged) > >> I have seemed to have offended many. > > Well, at least not me. Do not confuse being corrected by people with having > offended people. The reverse is true: If people actually took the(ir free) > time to correct you and give you hints how to do better, you showed some > promise :) > > <http://www.catb.org/~esr/faqs/smart-questions.html> > >> As for knowing why something works, that is why I am posting this >> question. I am just starting, page one, to learn CSS. > > Perhaps you should start with simpler things, and get to the CSS cascade > later. > > > PointedEars now I get it, hit head with hand! thanks for the help
From: coltrane on 13 Jun 2010 23:46 On 6/13/2010 1:32 PM, Adrienne Boswell wrote: > Gazing into my crystal ball I observed coltrane<tendengarci(a)yahoo.com> > writing in news:4c150e7e$0$31262$607ed4bc(a)cv.net: > >> How can I create nested lists with each level having different >> list-style-types. I tried to use different classes for each<ul> but >> then I get multiple list icons on the line for each nested list item. >> >> thanks >> >> john >> > > A url would be helpful. Make sure that you are not closing your li's, > eg: > > <ul> > <li>something</li> > <ul> > <li>something</li> > </ul> > </ul> > Is wrong > > <ul> > <li>something > <ul> > <li>something</li> > </ul> > </li> > </ul> > Is correct > > ul {list-style-type: bullet;} > ul li ul {list-style-type: square;} > much thanks, I now see the error of my ways
From: Bwig Zomberi on 14 Jun 2010 03:32
coltrane wrote: > How can I create nested lists with each level having different > list-style-types. I tried to use different classes for each <ul> but > then I get multiple list icons on the line for each nested list item. > Here is what I use in my style sheet. ol { list-style-type: decimal; } ol ol { list-style-type: lower-alpha; } ol ol ol { list-style-type: lower-roman; } ol ol ol ol { list-style-type: upper-alpha; } ol ol ol ol ol { list-style-type: upper-roman; } http://www.vsubhash.com/article.asp?id=61&info=Moral_Volcano's_Universal_CSS_Font_Stack -- Bwig Zomberi |