PDA

Click to See Complete Forum and Search --> : Link colours, especially for current page

Rodders
06-20-2005, 05:31 PM
Hi

I am trying to get the following to occur with my main navigation links at my site www.total-image-nation.co.uk

* link is #ffffff normally
* on hover and active it needs to be #fd9a00
* the link for the current page is also #fd9a00

I'm looking at fang's example in this thread.....
http://www.webdeveloper.com/forum/showthread.php?t=63226&highlight=body+link

but i just can't see how it is supposed to work, and needless to say it doesn't do what I want with my edited code

some HTML.......


<BODY ID='news'>

<DIV ID='rmenu'>
<A HREF='news.php' ALT='NEWS' ID='news'>NEWS</A>
<BR><A HREF='about.php' ALT='ABOUT' ID='about'>ABOUT</A>
<BR><A HREF='/forum/index.php' ALT='FORUM' ID='forum'>FORUM</A>
<BR><A HREF='events.php' ALT='EVENTS' ID='events'>EVENTS</A>
<BR><A HREF='exhibitions.php' ALT='EXHIBITIONS' ID='exhibitions'>EXHIBITIONS</A>
<BR><A HREF='opportunities.php' ALT='OPPORTUNITIES' ID='opportunities'>OPPORTUNITIES</A>
<BR><A HREF='portfolios.php' ALT='PORTFOLIOS' ID='portfolios'>PORTFOLIOS</A>
<BR><A HREF='reviews.php' ALT='REVIEWS' ID='reviews'>REVIEWS</A>
<BR><A HREF='competitions.php' ALT='COMPETITIONS' ID='competitions'>COMPETITIONS</A>
<BR><A HREF='offers.php' ALT='OFFERS' ID='offers'>OFFERS</A>
<BR><A HREF='archive.php' ALT='ARCHIVE' ID='archive'>ARCHIVE</A>
<BR><A HREF='links.php' ALT='LINKS' ID='links'>LINKS</A>
<BR><A HREF='contact.php' ALT='CONTACT US' ID='contact'>CONTACT US</A>
</DIV>


some CSS.......


#rmenu A {
color: #ffffff;
text-decoration: none
}

#news #about #events #exhibitions #opportunities,
#portfolios #reviews #competitions #offers #archive,
#links #contact #admin {
color: #fd9a00;
text-decoration: none
}
ray326
06-20-2005, 11:23 PM
How about

a:link { color:#fff; text-decoration:none; }
a:visited { color:#fff; text-decoration:none; }
a:hover,
a:active,
#newspage #news { color:#fd9a00; text-decoration:none; }

Then change your body id to "newspage". You can only use one id per page.
Rodders
06-21-2005, 04:07 AM
ray326, I can see now how it is supposed to work.........i was being a bit dumb as I haven't used CSS that uses '#idparent #idchild' before.

However, I have changed it to the following and it still isn't having the desired result. Basically the links are always #ffffff


#rmenu A:link,
#rmenu A:visited {
color: #ffffff;
text-decoration: none
}

#rmenu A:hover,
#rmenu A:active,
#newshome #news,
#abouthome #about,
#eventshome #events,
#exhibitionshome #exhibitions,
#opportunitieshome #opportunities,
#portfolioshome #portfolios,
#reviewshome #reviews,
#competitionshome #competitions,
#offershome #offers,
#archivehome #archive,
#linkshome #links,
#contacthome #contact,
#adminhome #admin {
color: #fd9a00;
text-decoration: none
}
Fang
06-21-2005, 05:59 AM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>menu</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
<!--
body {background:#ddd;}
#rmenu a {display:block;}
a:link { color:#fff; text-decoration:none; }
a:visited { color:#fff; text-decoration:none; }
a:hover,
a:active,
#current { color:#fd9a00; text-decoration:none; }
-->
</style>

</head>
<body>

<DIV ID='rmenu'>
<A HREF='news.php' ALT='NEWS'>NEWS</A>
<A HREF='about.php' ALT='ABOUT'>ABOUT</A>
<A HREF='/forum/index.php' ALT='FORUM' id="current">FORUM</A>
<A HREF='events.php' ALT='EVENTS'>EVENTS</A>
<A HREF='exhibitions.php' ALT='EXHIBITIONS'>EXHIBITIONS</A>
<A HREF='opportunities.php' ALT='OPPORTUNITIES'>OPPORTUNITIES</A>
<A HREF='portfolios.php' ALT='PORTFOLIOS'>PORTFOLIOS</A>
<A HREF='reviews.php' ALT='REVIEWS'>REVIEWS</A>
<A HREF='competitions.php' ALT='COMPETITIONS'>COMPETITIONS</A>
<A HREF='offers.php' ALT='OFFERS'>OFFERS</A>
<A HREF='archive.php' ALT='ARCHIVE'>ARCHIVE</A>
<A HREF='links.php' ALT='LINKS'>LINKS</A>
<A HREF='contact.php' ALT='CONTACT US'>CONTACT US</A>
</DIV>
</body>
</html>
Rodders
06-21-2005, 07:54 AM
awesome.....

thanks to all who helped.

i just learned that CSS is case-sensitive sometimes! sorry! - learn the hard way I guess.

I'm gonna have to spend some time making all my tags lower case with a view to going to XHTML or XML soon.

Thanks again
Fang
06-21-2005, 08:20 AM
Get the editor HTML-Kit (http://www.chami.com/html-kit/) which has Tidy (http://www.w3.org/People/Raggett/tidy/) built in.
Tip: use double quotes in html and single quotes in JavaScript
Rodders
06-21-2005, 09:30 AM
thanks