4 replies [Last post]
DeathRobot
Offline
newbie
Last seen: 9 years 28 weeks ago
Timezone: GMT-7
Joined: 2012-03-05
Posts: 6
Points: 9

I am using a list to create a navigation menu. It's class is "menu". In my stylesheet, I have some styles I want to affect ALL links on every page, and some just on the "menu" list. So I have:

a {
	text-decoration:none;
}
#menu a {
	color:#999;
	padding:10.5px 11px 10.5px 11px;
}

These styles affect the menu links correctly. However, when I place hover, focus, and active classes outside of the menu class they do not work:

a:hover, a:focus {
	color: #ce6a2e;
}
a:active {
	color: #ce6a2e;
}

Instead, I have to place the hover and focus classes as children of the "menu" class in order to get them to work:

#menu a:hover, a:focus {
	color: #ce6a2e;
}
 
#menu a:active {
	color: #b65909;
}

Why would text-decoration affect the list items, but not the other?

Thanks.

P.S. Doctype for html page is "".

Bhuvani
Bhuvani's picture
Offline
Regular
Last seen: 8 years 40 weeks ago
Timezone: GMT+5.5
Joined: 2011-05-18
Posts: 16
Points: 16

Hi, It does not work. Because

Hi,

It does not work.

Because u have given color in inside of the menu tag. #menu a {color:#999;}
color:#999; just move to Anchor tag. Ref: a{text-decoration:none; color:#999;}

In CSS style preference detail below:

Inline Style [inside an HTML element]
Internal Style or Embedded Style [in the head section - <style>.....</style>]
External Style [in the head section - <link rel="stylesheet" type="text/css" href="example.css"/> ]
@import Style [@import url('example.css');]

Ref link: http://www.w3schools.com/css/css_howto.asp
http://www.stevesouders.com/blog/2009/04/09/dont-use-import/

DeathRobot
Offline
newbie
Last seen: 9 years 28 weeks ago
Timezone: GMT-7
Joined: 2012-03-05
Posts: 6
Points: 9

Thank you , Bhuvani. That

Thank you , Bhuvani. That makes sense. One more question, I always use the same hover color, but some sections need a different font color than #999, so would I just keep things as I have them?

balajidesign
balajidesign's picture
Offline
Enthusiast
Last seen: 8 years 14 weeks ago
Timezone: GMT+5.5
Joined: 2012-01-31
Posts: 116
Points: 124

Hi DeathRobot, I always use

Hi DeathRobot,

I always use the same hover color, but some sections need a different font color than #999, so would I just keep things as I have them?

See: in wherever you want to add that hover color option. add the color:#999 !important in that particular class. !important should be override that color.

Thanks,

DeathRobot
Offline
newbie
Last seen: 9 years 28 weeks ago
Timezone: GMT-7
Joined: 2012-03-05
Posts: 6
Points: 9

Thanks

Thanks, balajidesign. I am still having some related trouble, though I moved the related question to the beginner forum:

http://csscreator.com/topic/ahover-one-div-affecting-ahover-other-divs