By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
425,588 Members | 1,920 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 425,588 IT Pros & Developers. It's quick & easy.

Assigning multiple keywords to define a style

P: n/a
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?

--
Sandman[.net]
Jul 20 '05 #1
Share this Question
Share on Google+
7 Replies


P: n/a
Sandman <mr@sandman.net> wrote:
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>
Almost--separate the class names with spaces.

And

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


No, define the style of each class independently.

--
Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ôter le premier point de mon adresse de courriel.
Jul 20 '05 #2

P: n/a
Sandman wrote:
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 */
}

--
Brian (remove ".invalid" to email me)
http://www.tsmchughs.com/
Jul 20 '05 #3

P: n/a
In article <n5********************************@4ax.com>,
Harlan Messinger <hm*******************@comcast.net> wrote:
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>


Almost--separate the class names with spaces.


Ok
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.

--
Sandman[.net]
Jul 20 '05 #4

P: n/a
Sandman <mr@sandman.net> wrote:
In article <n5********************************@4ax.com>,
Harlan Messinger <hm*******************@comcast.net> wrote:
>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>
Almost--separate the class names with spaces.


Ok
>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.


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.

--
Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ôter le premier point de mon adresse de courriel.
Jul 20 '05 #5

P: n/a
In article <10*************@corp.supernews.com>,
Brian <us*****@julietremblay.com.invalid> wrote:
Sandman wrote:
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 */
}


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?

--
Sandman[.net]
Jul 20 '05 #6

P: n/a
In article <75********************************@4ax.com>,
Harlan Messinger <hm*******************@comcast.net> wrote:
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.


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.

--
Sandman[.net]
Jul 20 '05 #7

P: n/a
Sandman <mr@sandman.net> wrote:
In article <75********************************@4ax.com>,
Harlan Messinger <hm*******************@comcast.net> wrote:
>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.


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.

--
Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ôter le premier point de mon adresse de courriel.
Jul 20 '05 #8

This discussion thread is closed

Replies have been disabled for this discussion.