468,738 Members | 2,397 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 468,738 developers. It's quick & easy.

Styling Nested Lists Using IE

Hi,

I'm doing some work in an intranet environment where I'm forced to use
IE 6.0. Is it possible to style (unordered) nested lists so that the
inner list items have a different appearance to the outer list items? I
can't get it to work using descendant selectors.

Thanks in advance,

John

Jul 20 '05 #1
5 2426
*John Topley* wrote:
Hi,
Hi
I'm doing some work in an intranet environment where I'm forced to use
IE 6.0. Is it possible to style (unordered) nested lists so that the
inner list items have a different appearance to the outer list items?
I can't get it to work using descendant selectors.


#mylist ul {
font-style: italic;
}
#mylist ul ul {
font-weight: bold;
}
<ul id="mylist">
<li>Biscuits
<ul>
<li>Rich Tea</li>
<li>Bourbon</li>
<li>Digestive
<ul>
<li>Plain</li>
<li>Milk Chocolate</li>
<li>Dark Chocolate</li>
</ul>
</li>
<li>Custard Creme</li>
</ul>
</li>
<li>Fish</li>
<li>Wildebeast</li>
</ul>
--
Andrew Urquhart
- FAQ: http://www.css.nu/faq/ciwas-aFAQ.html
- Archive: http://tinyurl.com/ysjbm (Google Groups)
- Contact me: http://andrewu.co.uk/contact/
- This post is probably time-stamped +1 hour - blame my ISP (NTL)
Jul 20 '05 #2
John Topley wrote:
I'm doing some work in an intranet environment where I'm forced to
use IE 6.0. Is it possible to style (unordered) nested lists so that
the inner list items have a different appearance to the outer list
items? I can't get it to work using descendant selectors.


li {}
li li {}

I'm guessing that you tried this. What problems were you having? You may
need to post a dummy page in a public place for us to see.

--
Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/
Jul 20 '05 #3
Brian wrote:
I'm guessing that you tried this. What problems were you having? You
may need to post a dummy page in a public place for us to see.


Thanks, still no luck though. See
http://www.johntopley.com/development/lists.html - it's the #menu part.
I think it might be something to do with the fact that I'm styling my
outer list with an image.

John
Jul 20 '05 #4
"John Topley" <john@$NO_SPAM$topley.freeserve.co.uk> wrote:
http://www.johntopley.com/development/lists.html - it's the #menu part.
OK, now we are getting at something. It helps to know the facts of the
case.
I think it might be something to do with the fact that I'm styling my
outer list with an image.


Nope.

It's a cascade issue. First, you have

/* Doesn't work? */
#menu ul ul li {
font-weight: normal;
}

And it really doesn't work - for any <a> element, no matter how nested
inside other elements, if there is _any_ style sheet that assigns a
font-weight value to it.

Second, changing the selector to

#menu ul ul li a

is not sufficient. By the cascade rules, it has specificity (0,1,0,4), so
it loses to a rule like

#menu li a:visited {
color: #000;
font-weight: bold;
text-decoration: none;
}

where the selector has specificity (0,1,1,2), which is greater. The key
is the pseudoclass selector :visited (or :link or whatever applies),
which contributes to the third component in the specificity. Using the
selector

#menu ul ul li a:visited

would help, and so would !important. But your sample is too sketchy - you
are not really going to make the mistake #1 of setting unvisited and
visited links similar, are you? - to allow a specific (no pun intended)
constructive suggestion.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Jul 20 '05 #5
Jukka K. Korpela wrote:
#menu ul ul li a:visited

would help, and so would !important. But your sample is too sketchy -
you are not really going to make the mistake #1 of setting unvisited
and visited links similar, are you? - to allow a specific (no pun
intended) constructive suggestion.


Thanks, that did the trick. And you're right, I shouldn't make that
mistake.

Regards,

John
Jul 20 '05 #6

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

25 posts views Thread by chad | last post: by
15 posts views Thread by Xah Lee | last post: by
reply views Thread by Knepley, Jim | last post: by
5 posts views Thread by Peter Collinson | last post: by
7 posts views Thread by Jane Withnolastname | last post: by
4 posts views Thread by Lee K. Seitz | last post: by
6 posts views Thread by jwvai316 | last post: by
6 posts views Thread by ashkaan57 | last post: by
7 posts views Thread by patrick j | last post: by
1 post views Thread by CARIGAR | last post: by
xarzu
2 posts views Thread by xarzu | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.