Assigning multiple keywords to define a style

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

Sandman - 27 Aug 2004 10:15 GMT

I have a script that generates a hierarchical menu, but I am having problems
assigning styles to each manu items different possible states. The possible
states a menu item can be in is (and all of these can be combined unless they
are mutually exclusive):

1. It can belong to a specific level in the hierarchy; 1, 2, 3 and so on.
2. It is the active menu
3. It is an inactive menu
4. It has children
5. It does not have children

As you see, there are quite a lot of things a specific menu can belong to, such
as:

Menu item "Front page" may belong to level 1, be the active menu and have
children - and should have an apparence that coprrespondes to this.

Is there a way to assign multiple classes, or in any other way manage this
parrticular menus look? In pseudo-code:

<div class="menu,level1,active,haschildren">Front Page</div>

And

.menu .level1 .active .haschildren { ... }

Any way to do this?

Signature

Sandman[.net]

Reply to this Message

Harlan Messinger - 27 Aug 2004 12:38 GMT

>I have a script that generates a hierarchical menu, but I am having problems
>assigning styles to each manu items different possible states. The possible
[quoted text clipped - 17 lines]
>
> <div class="menu,level1,active,haschildren">Front Page</div>

Almost--separate the class names with spaces.

>And
>
> .menu .level1 .active .haschildren { ... }

No, define the style of each class independently.

Signature

Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ôter le premier point de mon adresse de courriel.

Reply to this Message

Sandman - 28 Aug 2004 12:18 GMT

> >I have a script that generates a hierarchical menu, but I am having problems
> >assigning styles to each manu items different possible states. The possible
[quoted text clipped - 21 lines]
>
> Almost--separate the class names with spaces.

> >And
> >
> > .menu .level1 .active .haschildren { ... }
>
> No, define the style of each class independently.

No, that won't work. I want a specific style for that exact combination of
styles.

I once saw a style declarations that looked like this:

.class < .otherclass { ... }

But I am unsure if it was CSS or perhaps XLS. I don'tknow what it did though.

Signature

Sandman[.net]

Reply to this Message

Harlan Messinger - 28 Aug 2004 12:52 GMT

>> >I have a script that generates a hierarchical menu, but I am having problems
>> >assigning styles to each manu items different possible states. The possible
[quoted text clipped - 32 lines]
>No, that won't work. I want a specific style for that exact combination of
>styles.

Oh, OK. I figured you just wanted to combine and cascade. Then remove
the spaces in your list of period-headed classes, as Brian suggested.

>I once saw a style declarations that looked like this:
>
> .class < .otherclass { ... }

There isn't any E1 < E2. There's E1 > E2, which matches any element
matching E2 that is a child (an immediate child, not a descendent) of
an element matching E1.

>But I am unsure if it was CSS or perhaps XLS. I don'tknow what it did though.

Signature

Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ôter le premier point de mon adresse de courriel.

Reply to this Message

Sandman - 28 Aug 2004 22:49 GMT

> >I once saw a style declarations that looked like this:
> >
[quoted text clipped - 3 lines]
> matching E2 that is a child (an immediate child, not a descendent) of
> an element matching E1.

Ok, could you elaborate? How do I use it and what are the rules for it - maybe
you have a good reference URL for this.

Signature

Sandman[.net]

Reply to this Message

Harlan Messinger - 28 Aug 2004 23:37 GMT

>> >I once saw a style declarations that looked like this:
>> >
[quoted text clipped - 6 lines]
>Ok, could you elaborate? How do I use it and what are the rules for it - maybe
>you have a good reference URL for this.

??? You use it as in your example above, except with > instead of <,
and I already explained what it means. Everything about CSS selectors
is explained at

http://www.w3.org/TR/CSS2/selector.html

See section 5.1, Pattern Matching, on that page. But as I also said,
this is inapplicable to what you wanted to do: use multiple classes
for the same HTML element.

Signature

Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ôter le premier point de mon adresse de courriel.

Reply to this Message

Brian - 27 Aug 2004 15:53 GMT

> Is there a way to assign multiple classes, or in any other
> way manage this parrticular menus look?
>
> <div class="menu,level1,active,haschildren">Front Page</div>

<div class="menu level1 active haschildren">Front Page</div>

> .menu .level1 .active .haschildren { ... }

.menu.level1.active.haschildren {
/* styles only for element that has _all_
of these classes */
}

.menu {
/* styles for any element that has class menu
including the div as I wrote above */
}

.active {
/* styles for any element that has class active
including the div as I wrote above */
}

Signature

Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/

Reply to this Message

Sandman - 28 Aug 2004 13:55 GMT

> > Is there a way to assign multiple classes, or in any other
> > way manage this parrticular menus look?
[quoted text clipped - 19 lines]
> including the div as I wrote above */
> }

Yes, this seems to work - in Safari for Mac, but not for IE for PC... What are
the limitations of IE regarding this and can I work around them somehow and
reach the same result?

Signature

Sandman[.net]

Reply to this Message

Webmaster Forum / HTML, CSS, Scripts / CSS / August 2004

Assigning multiple keywords to define a style