Color in a Pull-Down Menu

D

Dennis M. Marks

Can there be different colors for words on a pull-down menu either on
the same or different lines?

red blue
red blue
red blue
etc

or

red
red
blue
red
blue
etc
 
D

Disco Octopus

Dennis said:
Can there be different colors for words on a pull-down menu either on
the same or different lines?
what do you mean by 'dropdown menu'? do you mean this....

<select>
<option value="1" style="background-color:blue;">one</option>
<option value="2" style="background-color:red;">two</option>
</select>


i am sure sure if this will work in many browsers, but it works in IE5.5 and
NS 7.1, and it does not work in Opera 7.1
 
L

Leif K-Brooks

Dennis said:
Can there be different colors for words on a pull-down menu either on
the same or different lines?

Pull-down menu created with a <select>? Pure CSS? CSS and Javascript?
 
D

Dennis M. Marks

<SELECT etc>
<OPTION etc>
<OPTION etc>
</SELECT>

Yes, either or both. Just looking for options to play around with. They
only have to work in IE, but it would be nice to work in others. If you
go to my web site http://www.dcs-chico.com/~denmarks/ and go to the
Amtrak page you will see a list of trains (first pull-down menu). I
would like the cities to be a different color than the trains. Some of
the lines are for discontinued trains. I would like them to be another
color.
 
D

Disco Octopus

Dennis said:
<SELECT etc>
<OPTION etc>
<OPTION etc>
</SELECT>

Yes, either or both. Just looking for options to play around with.
They only have to work in IE, but it would be nice to work in others.
If you go to my web site http://www.dcs-chico.com/~denmarks/ and go
to the Amtrak page you will see a list of trains (first pull-down
menu). I would like the cities to be a different color than the
trains. Some of the lines are for discontinued trains. I would like
them to be another color.

Just took a look at your page. Looks like you got it working!

Dont know if you want to know this, but I will tell you anyway....
It looks like you are creating line in you page using the document.write and
assigning an "id" to the line (<OPTION>) depending on its type..... it may
be 'better' if you assign a class rather than an ID because the way that you
are doing it now means that the ID will not be unique. Or I may be wrong.
 
D

Dennis M. Marks

Disco Octopus said:
Just took a look at your page. Looks like you got it working!

Dont know if you want to know this, but I will tell you anyway....
It looks like you are creating line in you page using the document.write and
assigning an "id" to the line (<OPTION>) depending on its type..... it may
be 'better' if you assign a class rather than an ID because the way that you
are doing it now means that the ID will not be unique. Or I may be wrong.

I'm not too clear as to the difference between CLASS and ID. The IDs
are unique for a specific color. Are you saying that multiple OPTIONS
can't have the same ID. It seems to work. BTW: It only works when there
are multiple lines for the SELECT. It will not work for a dropdown
menu.

Can someone clearly explain the difference between CLASS and ID and
when to use them?
 
R

rf

Dennis M. Marks said:
I said "clearly" please.

What could be clearer than that? The specs are notorious for being
unreadable but in this case it is quite clear: Both id and class can be use
as a style sheet selector. id must be unique within a document. class may be
shared between several element instances. You are using the same id in
multiple elements. This is not allowed. Use class.

I know very little about javascript.

Nothing to do with javascript. This is CSS.
Can you
tell be if I am using the right one in
http://www.dcs-chico.com/~denmarks/amtrak.html

BTW: I just noticed that the page works in IE but not Navigator. Any
ideas why?

Probably because of all the markup errors, particularly around the <select>,
<option> and <form> elements.

Take it over to http://validator.w3.org to find them.

Cheers
Richard.
 
J

Jukka K. Korpela

brucie said:
you cant get much clearer than that

I guess you're right, but let's try:

Both id and class attributes just attach some names to elements. The
difference is that id is like a proper name, very proper, in the sense
that you can attach it to one element only. And class is like a common
name, which you can attach to as many elements as you like.

The rest is just a formal description of this idea, plus some formal
rules on how the names can be written.

And, as stated, one doesn't need to know anything about JavaScript to
understand this. Or about CSS for that matter. It has _implications_ on
CSS; selectors that utilize id and class attributes are different.
 
R

rf

Jukka K. Korpela said:
I guess you're right, but let's try:

Both id and class attributes just attach some names to elements. The
difference is that id is like a proper name, very proper, in the sense
that you can attach it to one element only. And class is like a common
name, which you can attach to as many elements as you like.

Hmmm. In this case I think the explanation in the specs is actually better
than yours, unusual as this might be Jukka:) Your explanation is by way of
metaphor, the spec is succinct.

After careful consideration I think both the spec and you may be slightly
wrong. There is this emphasis on the term "name". This is especially
confusing since "name" is an attribute itself, with a rather different
meaning.

Why don't we say just what the spec intends, or should have intended:

An id attribute is a unique identifier that may be given to an element. It
uniquely identifies the element. [add javascript/css/dom etc access to this
uniquely identified element here].

class is merely an attribute that does nothing except allow a style rule to
select an element that has a class attribute with a value of 'whatever'.
This may be reinforced by the fact that the class selector is introduced
rather late in chapter 5 of the CSS spec, as a shorthand way of selecting
[class~= whatever]

Cheers
Richard
 
T

Toby A Inkster

rf said:
class is merely an attribute that does nothing except allow a style rule to
select an element that has a class attribute with a value of 'whatever'.

You diminish the role of @class! Scripting languages can select elements
by @class and @class can be used for general purpose sub-classing of an
element.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,769
Messages
2,569,579
Members
45,053
Latest member
BrodieSola

Latest Threads

Top