473,473 Members | 2,179 Online
Bytes | Software Development & Data Engineering Community
Create Post

Home Posts Topics Members FAQ

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 2573
*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 thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

25
by: chad | last post by:
I am writing a program to do some reliability calculations that require several nested for-loops. However, I believe that as the models become more complex, the number of required for-loops will...
15
by: Xah Lee | last post by:
Here's the belated Java solution. import java.util.List; import java.util.ArrayList; import java.lang.Math; class math { public static List range(double n) { return range(1,n,1); }
0
by: Knepley, Jim | last post by:
I'm basing some work on Joe Celko's excellent idea of using nested sets to represent an organizational structure as opposed to an adjacency list. By and large it's a great idea, but not without its...
5
by: Peter Collinson | last post by:
Hi... Is there any way to style a List Item a different color and size than the <LI> in an Ordered List? I'd like a red super-script number and a dark blue text in a page's footnotes. And...
7
by: Jane Withnolastname | last post by:
I have a number of unordered lists nested within ULs nested within ULs nested within ULs. I have set the style for LI to be .7em. Mozilla gives me the layout as I imagined it, with the lists...
4
by: Lee K. Seitz | last post by:
I'm still relatively new to stylesheets. I'm trying to do something that seemed fairly simple on the surface, but is proving to be a challenge. I have a set of nested lists: <ul> <li>Side...
6
by: jwvai316 | last post by:
I don't really know how to say it so I just say it a nested linklist. How do you make LinkLists inside LinkList? Can anyone help me for this? I think an example program will help me a lot. ...
6
by: ashkaan57 | last post by:
Hi, How can I set up the styling for different levels of <ULto use different images for bullets, be indenetd differently, ... Like: .. list 1 - item 1 - item 2 .. list 2
7
by: patrick j | last post by:
Hi I'm wondering about lists with nested lists as one does on a Saturday afternoon. Anyway below is an example of a list with a nested list which the iCab browser's very useful HTML...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
1
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
0
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The...
0
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated ...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.