9 replies to this topic

[Leckie]

So i have in my css the a.active class for in my navigation but it doesn't seem to work it just ignores it and i don't know what i'm doing wrong. Can anyone help?

[rc69]

Are you talking about using the psuedo name :active, or the class .active. That might be where you're problem is, you didn't quite explain your problem well enough for me to be 100% sure, but try changing the period to a colon and see if that works.

[Leckie]

Well what i'm trying to do is have it so when my current page is active the link on my navigation stays white. here is my CSS.

/* Navigation
----------------------------------------------- */

#header .navigation {
float: right;
position: relative;
top: 62px;
padding: 0;
}

#header .navigation ul {
margin: 0;
padding: 0;
}

#header .navigation ul li {
width: 97px;
height: 28px;
background: url(images/navnohover.png) no-repeat;
text-align: center;
list-style: none;
float: left;
margin-left: 5px;
padding-top: 6px;
}

#header .navigation ul li a {
margin: 0;
padding: 0;
color: #a1adb6;
font-weight: normal;
font-size: 12px;
text-shadow: 0 0 0 #000;
text-decoration: none;
}

#header .navigation ul li a.active {
position: relative;
margin: 0;
padding: 0;
color: #fff;
}

#header .navigation ul li a:hover {
color: #fff;
}

[bay]

Leckie, on Dec 27 2006, 06:05 PM, said:

#header .navigation ul li a.active {
position: relative;
margin: 0;
padding: 0;
color: #fff;
}

a.active means you want to apply the class named "active" to your link. An example use of your current CSS is:

<a href="index.html" class="active">

BUT that, is not your desired effect. What rc69 said is correct, you need the pseudo name :active

There are 4 types used for links they are:
a:link, a:active, a:visited, and a:hover

Simply replace the "." with a ":" and you will be set to go

#header .navigation ul li a.active {
	position: relative;
	margin: 0;
	padding: 0;
	color: #fff;
}

[Leckie]

Yeah i tired that with no joy. Don't know what i'm doing wrong.

[rc69]

bay, on Dec 27 2006, 04:56 PM, said:

a.active means you want to apply the class named "active" to your link. An example use of your current CSS is:

<a href="index.html" class="active">
BUT that, is not your desired effect. What rc69 said is correct, you need the pseudo name :active

There are 4 types used for links they are:
a:link, a:active, a:visited, and a:hover

Simply replace the "." with a ":" and you will be set to go

#header .navigation ul li a.active {
	position: relative;
	margin: 0;
	padding: 0;
	color: #fff;
}

No, now what i said is incorrect. Let me explain:
a:link is a traditional link just sitting on the page with nothing happening to it.
a:active is a link that is currently being clicked on (i.e. press the left mouse button on a link and don't let go).
a:visited is a link to a page that has be previously viewed.
a:hover is a link with the mouse currently hovering over it.

That is why when he tried it, it didn't work. What we need to see now is the full html for your navigation (everything inside the #header div).

[Davey]

i might be wrong but i think in an older version of ie, when a link was active it stayed the same color set in a:active then when u went to another page it would goto wotever was in a:visited and the new link would stay that color... sure that was even the case in ie6 but i know for definite it isn't the case with ff or ie7... i thought active meant it was "active" until u left the page, not til u released the mouse button until i read up on it when trying to acheive the same results...

[Leckie]

I think i'm just going to leave it for now i know how to do it in JavaScript but didn't really want to. Oh and Davey I'm at University in Dundee.

[Davey]

Leckie, on Dec 31 2006, 02:23 PM, said:

I think i'm just going to leave it for now i know how to do it in JavaScript but didn't really want to. Oh and Davey I'm at University in Dundee.

hehe kool... u from round there?

[Leckie]

I'm from inverness