Topic: link css problem

Hi, guys. Please help me.
Here is senario.
I have a menu, which is made by css. It is link.
And I have page index at the bottom of page. They are link too.
I simply want to format differently.
I did something like below but did not work.

<div class="menu">

<a href="#">link1</a>

<a href="#">link2</a>

</div>

(this is menu)



<a href="#">1</a>

<a href="#">2</a>

(this is page index)

For the menu I did like:

menu.a{

              color:red;

              }

menu.a:hover{

                    color:blue;

}

Bascially I don't want this stylesheet for page index. I don't know why this stylesheet is applying for page index as well. I said: menu.a so that it has to be limited to link which has class menu, isn't it?
Am I wrong????
Help!.

Hiroki Kozai

I'm not entirely sure I understand the problem but,,,,,

add a . before your menu class. That will make it....a class And then take out the . after the menu.

so instead of :

menu.a{

     color:red;

}



menu.a:hover{

     color:blue;

}

you would have:

.menu a{

	color:red;

}



.menu a:hover{

	color:blue;

}

Is that what you were looking for?

Later,

C:\


~Binary is best~

Oh, I am sorry. That was not what I meant.
I did like you:

Here is my stylesheet for menu:

#menu{

	      background-color:#F9EEE3;

	      width: 110px;

	      padding: 0;

	      margin: 0;

	      font-family: arial, helvetica, sans-serif;

	      border: 1px solid #A37291;	   

		}

	

	

	 a{

		color: #A37291;

		text-decoration: none;

		width: 110px;	

		background-color:#F9EEE3;

		display: block;

		

		font-size:11px;

		font-weight:bold;

		

		

	

			}

	 a:hover{

		color: #F9EEE3;

		background-color:#A37291;

		

	

		}

And here is stylesheet for the page index:

a{

 	color: #ff6015;

	text-decoration: none;

 }

 

 a:hover{

 		text-decoration:underline;

 		}

But some reason, for the page index, always being applied one for menu.
Would you know what I mean?
Why does it happen???

Hiroki Kozai

You need to use:

#menu a {

}

and

#menu a:hover {

}

As your selectors.

:::11oh1:::

Hiroki: CPrompt was RIGHT! Since "menu" is the value of the class attribute of your DIV then you must address it via .menu in the stylesheet and preceed its children by that same selector thus the .menu a and .menu a:hover

If it's still broken, I fear you'll have to give an URL.

Mathieu "POÏ" HENRI

quote:

---

I did like you:

---

Nope, you didn't do like me

Gotta follow the rules. What you have there is an ID for menu and not a class. So, make sure that you use <div ID="menu"> and not <div class="menu"> in your html section for you menu stuff. AND, make sure that the menu link and hover have the # before it. Just like krets said (and me)


happy?

Later,

C:\


~Binary is best~

[This message has been edited by CPrompt (edited 11-11-2003).]

Whatever, you should *really* consider to read the CSS2 specifications. Once you'll have read them, you won't have that kind of problems ever.

Mathieu "POÏ" HENRI

krest? Who the hell is krest?

:::11oh1:::

Hi, guys. Many many thanks for that.
I worked all right!
Cheers.

Hiroki Kozai