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

Style Not Applying?

P: n/a
I have these selectors:

A {
text-decoration: none;
}
A:link {color: #0077BC;}
A:visited {color: #0077BC;}
A:hover {color: #0077BC; text-decoration: underline;}
A:active {color: #0077BC;}

and I have this selector:

#NavPanel A {
font-weight: bold;
}

and I have these selectors:

..OutLink {
font-weight: normal;
}
A.OutLink:link {color: #DC0053;}
A.OutLink:visited {color: #DC0053;}
A.OutLink:hover {color: #DC0053; text-decoration: underline;}
A.OutLink:active {color: #DC0053;}

Inside NavPanel I have <A CLASS="OutLink">. It takes the color from the
OutLink selectors, but stays bold, and won't go to normal. I also tried
"lighter" and I tried numerical values, and I tried putting the font-
weight property in the A.OutLink selectors, but it doesn't change. I
tried moving .OutLink before the A selector in the file, but that doesn't
make any difference. What am I missing?

--
Alan Little
Phorm PHP Form Processor
http://www.phorm.com/
Jul 20 '05 #1
Share this Question
Share on Google+
2 Replies


P: n/a

"Alan Little" <al**@n-o-s-p-a-m-phorm.com> wrote in message
news:Xn**************************@216.196.97.132.. .
I have these selectors:

A {
text-decoration: none;
}
A:link {color: #0077BC;}
A:visited {color: #0077BC;}
A:hover {color: #0077BC; text-decoration: underline;}
A:active {color: #0077BC;}

and I have this selector:

#NavPanel A {
font-weight: bold;
}

and I have these selectors:

.OutLink {
font-weight: normal;
}
A.OutLink:link {color: #DC0053;}
A.OutLink:visited {color: #DC0053;}
A.OutLink:hover {color: #DC0053; text-decoration: underline;}
A.OutLink:active {color: #DC0053;}

Inside NavPanel I have <A CLASS="OutLink">. It takes the color from the
OutLink selectors, but stays bold, and won't go to normal. I also tried
"lighter" and I tried numerical values, and I tried putting the font-
weight property in the A.OutLink selectors, but it doesn't change. I
tried moving .OutLink before the A selector in the file, but that doesn't
make any difference. What am I missing?


Try being more specific in the style sheet. Unless you're using the OutLink
class elsewhere in the NavPanel, using #NavPanel A.OutLink { font-weight:
normal; } ought to do the trick.
Jul 20 '05 #2

P: n/a
Alan Little <al**@n-o-s-p-a-m-phorm.com> wrote:

#NavPanel A {
font-weight: bold;
}

and I have these selectors:

.OutLink {
font-weight: normal;
}

Inside NavPanel I have <A CLASS="OutLink">. It takes the color from the
OutLink selectors, but stays bold, and won't go to normal.


That's correct. The first style is more specific (it has an ID and an
element name, therefore specificity = 101) than the second (which just
has a class, specificity = 010). See
http://www.w3.org/TR/CSS2/cascade.html#specificity

Change the second selector to #NavPanel .OutLink and it will behave as
you desire.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>
Jul 20 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.