Computing.Net > Forums > Web Development > css question

Computer Problems? Computing.Net has over 1,000,000 posts about all things technology related! Over 90% answered within 24 hours! Click here to start participating now! Also, be sure to check out the New User Guide.

css question

Reply to Message Icon

Name: nick1
Date: June 3, 2004 at 08:29:19 Pacific
OS: winxp
CPU/Ram: intel
Comment:

Greetings,

i have a question regarding CSS. Here's what one of my sheets looks like:

====================
a:link{text-decoration:none; color:#0000ff; font-weight:bold;}
a:visited{text-decoration:none; color:#0000ff; font-weight:bold;}
a:hover{text-decoration:none; color:#00ff00; font-weight:bold;}

p.pic
{
position:absolute;
left:275px;
top:104px;
}

p.message
{
a:link{text-decoration:none; color:#0000ff; font-weight:normal;}
a:visited{text-decoration:none; color:#0000ff; font-weight:normal;}
a:hover{text-decoration:none; color:#00ff00; font-weight:normal;}
position:absolute;
top:475px;
}
============================

i want the hyperlinks in "p.message" to display as normal text, NOT BOLDED like the hyperlinks in "p.pic" appear. What do i need to alter in this code to make this happen?
i would like keep this all within one style sheet.

Thanks for your time,

Nick



Sponsored Link
Ads by Google

Response Number 1
Name: Jamie_McCoy
Date: June 3, 2004 at 15:21:50 Pacific
Reply:

a:link{text-decoration:none; color:#0000ff; font-weight:normal;}

why are you puttin

;

before the closing bracket, it is not needed, however i dont think this will solve your porblem, may wanna try it though...

i think the way you have got it set out,

a:link{text-decoration:none; color:#0000ff; font-weight:bold;}
a:visited{text-decoration:none; color:#0000ff; font-weight:bold;}
a:hover{text-decoration:none; color:#00ff00; font-weight:bold;}

is overiding p.message

Sign Me Guestbook!

jaymc.co.nr


0

Response Number 2
Name: SN
Date: June 3, 2004 at 15:59:09 Pacific
Reply:

If you look at the syntax rules for CSS (and you wondered when you would ever use all those grammar rules you learned in college...), you will see that what you're trying to do is nested rulesets...This isn't allowed. The only thing allowed in declaration blocks are declarations...not more declaration blocks.

I don't know if parsers even know what an element's "parent" is, although I suppose it's possible that in the future they might allow something like what you're trying to do.

Also, the rules show that the ; before the } is perfectly legal CSS.

On to solving the problem...You'll have to have each Anchor have a class, ([A href="#" class='inmessage']) and give rules for them as A.inmessage:hover, A.inmessage:link, etc.

I know this is lame, and if anybody has a better solution I'm all ears. You may be stuck with this though.

-SN


0

Response Number 3
Name: Jamie_McCoy
Date: June 3, 2004 at 16:08:10 Pacific
Reply:

yeh thats what i was thinkin, take a lot of messin round though, unlucky mate

about that ;} bit

yeh its allowed, but why do it if its not needed? lol, mind u every 1 has their own ways

Sign Me Guestbook!

jaymc.co.nr


0

Response Number 4
Name: pcweirdo
Date: June 4, 2004 at 06:21:42 Pacific
Reply:

I think

"p.message
{
a:link{text-decoration:none; color:#0000ff; font-weight:normal;}
a:visited{text-decoration:none; color:#0000ff; font-weight:normal;}
a:hover{text-decoration:none; color:#00ff00; font-weight:normal;}
position:absolute;
top:475px;
}"

could be better written as

"p.message
{
position:absolute;
top:475px;
}

p.message a:link
{
text-decoration:none; color:#0000ff; font-weight:normal;
}

p.message a:visited
{
text-decoration:none; color:#0000ff; font-weight:normal;
}

p.message a:hover
{
text-decoration:none; color:#00ff00; font-weight:normal;
}"

'eyyyyyyyyyy


0

Response Number 5
Name: safeTsurfa
Date: June 4, 2004 at 06:49:09 Pacific
Reply:

Exactly right pcweirdo, that is the correct way, so you are declaring the context for the non-bolded link. I suggest you also declare a context of BODY for the default link style, this will establish the start point for the hierarchy of inheritance for the link element.

Jamie, if you test CSS against W3C standards, it expects to see the semi-colon. Without may work, but it is not valid coding. :)



0

Related Posts

See More



Response Number 6
Name: nick1
Date: June 4, 2004 at 07:17:26 Pacific
Reply:

Thank you all very much for your thoughts on this question. I successfully implemented the css at hand with SN's and Pcweirdo's suggestions and things appear to work fine. Once again, thanks to everyone for their help.

Nick


0

Response Number 7
Name: SN
Date: June 4, 2004 at 22:26:34 Pacific
Reply:

pcweirdo's way is much better...I should have read the next page on CSS syntax rules...Descendant selectors.

All of the CSS examples on w3.org's site omit the last semicolon on the CSS rules...So it's pretty hypocritical of them to not allow it in their validators :-)

-SN


0

Response Number 8
Name: safeTsurfa
Date: June 6, 2004 at 15:18:46 Pacific
Reply:

Yep, but still they do it. I code to CSS 1 and 2 standards and it requires a semi-colon.


0

Sponsored Link
Ads by Google
Reply to Message Icon






Post Locked

This post is quite old and has been locked from receiving new replies. Please create a new posting instead.


Go to Web Development Forum Home


Sponsored links

Ads by Google


Results for: css question

css question www.computing.net/answers/webdevel/css-question/2048.html

Simple CSS help? www.computing.net/answers/webdevel/simple-css-help/228.html

CSS questions: www.computing.net/answers/webdevel/css-questions/2493.html