Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations gkittelson on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

For the life of me... 2

Status
Not open for further replies.

Bentley22

Programmer
Aug 29, 2001
205
CA
Another Cross Browsers support question, however I havn't been able to find a related topic. This has to do with Netscape 6, right now I don't want to think about 4.x

The problem is related to the rollover text effect you can achieve with CSS. Is the :hover property not supported when used with a class in N6? It all works perfectly fine if its not defined as a class.

Ex. Code:
Code:
//This all works perfectly in N6
A:link	{color: #ab6426;}
A:hover {color: #000000;}
A:visited {color:#ab6426;}
A:visited:hover {color: #000000;}
A:active {color: #000000;}

//Then, defined in a class...
.link:link	{color: #FFFFFF;}     //Works
.link:hover {color: #000000;}         //Don't work
.link:visited {color:#FFFFFF;}        //Works
.link:visited:hover {color: #000000;} //Don't work
.link:active {color: #000000;}        //Works

I tried adding an A before each .link, but that didn't help.

Can someone help me with this? Its not a major problem, but I'd like the sites to look and behave a close as possible between the browsers.
 
Hi,

First: Are you sure that "visited" works, because you use the same color for it, and for me you won't see a difference then.

Second: When you code the :hover before the : visited then the hover won't work so change the following order of your code.

A:link {color: #ab6426;}
A:visited {color:#ab6426;}
A:hover {color: #000000;}

.link:link {color: #FFFFFF;}
.link:visited {color:#FFFFFF;}
.link:hover {color: #000000;}

Erik

 
Ok, thanks for the notice, Visited dosn't work either :(

However, changing the order of the code did not work as well.
 
Zilch, no change. Are there reserved words in CSS? I hadn't run across them before.
 
What did you change it to? The class name "link" will not work in Netscape 6x
Also, you don't have those comments in there, do you?
 
No, the comments I added for the post. changed the name to 'custlink'
 
What exact version of Netscape are you using? I'm running 6.1 and it is working fine with the code you posted (after changing the class name)...

If you're using 6.0 or 6.01 it could be a bug in the browser.

There is also a small chance that it is a problem elsewhere in the code... You could try posting the entire code.
 
ok i think i can solve this one.

firstly you need to put the four anchor types in this order always.

link, visited, active, hover

however this is not your problem Bentley. As strange as it may seem all you should have to do is specify them like this.

a:link.link{color:#234245}
a:visited.link{color:#234def}
a:active.link{color:#53fe3a}
a:hover.link{color:#41d36f}

i did it the other way first time too and couldnt see the logic behind having it this way but i definetely works..

hope this helps

rob
 
Netscape 6.1

Thanks ErikL, the visited attribute works now.

Didn't realize the order mattered quite that much.

One thing I've noticed, on all the links that won't display the rollover effect, I have an onMouseOver event firing within the anchor tag. Could this have something to do with it? Its only the hover attribute that isn't working now.

Tried your solution crazyboybert, no go.
 
Yes, that (the onmouseover event) would be the problem.

That was a bug with Mozilla that was not fixed in the version that Netscape 6.1 is based on...
 
Thanks for all your suggestions, I'm just going to have to live with the no-mousovering effect for now.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top