Attn css javascript pros (newbie)

[AlbertAguirre]

My navigation in my project is a table with several rows. Each row has a text link in it.
In css I have the entire row go dark on a mouse rollover (hover).
For mozilla and others its done with css alone.
For IE its got to be javascript (thanx bill gates)

My problem is that it looks great as long as the text links are NOT links.
When I make the text an actual link (href) then the default link styling takes over.

How do I override the default link styling?

I created a new class for the links and it works fine but only when I rolover the link.
I want the formatting to change when i hover over the table row not just the actual text.

makes sense?

see the project here:

http://www.serissolutions.com/portal/tester.php?

 

[monksnake]

I'd go about this by defining your anchor tags as
display:block. Then you can set a width on the anchors in your class declarations so the entire row (which I see is one TD) will contain the anchor and any :hover styles will apply when hovered over the row at all.





<.

 

[monksnake]

better yet, I looked at your site.

Add another leftNav class like this:

a.leftNav {
	font-weight: bold;
	color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none;
}

With no psuedoclass i.e. :hover, :visited, etc.

That will make the anchors with class leftNav be white, bold, and with no underline as is.






<.

 

[AlbertAguirre]

looks good but its white all the time. Needs to be drk grey until the table row is rolled over.

Look at the SUPPORT link here:

http://www.serissolutions.com/portal/tester.php?

 

[AlbertAguirre]

Maybe with javascript?

How do I change the styling in javascript for the links tagged with class "leftNav"?

 

[traingamer]

Try

[b].leftNav a:hover[/b] {
	font-weight: bold;
	color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none;

etc.

rather than

[b]a.leftNav:hover [/b]{
	font-weight: bold;
	color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none;

(and actually assign the class to your link.)

Greg
"Personally, I am always ready to learn, although I do not always like being taught." - Winston Churchill

 

[AlbertAguirre]

That works fine but the text does not change on the table rollover.
In other words, I want me text color to change when i rollover the area in the table the text is in, not just rolling over the text itsself.

 

[traingamer]

Have you tried the display:block suggested by monksnake? e.g.

.leftnav a {
display: block
...
}

Greg
"Personally, I am always ready to learn, although I do not always like being taught." - Winston Churchill

 

[monksnake]

Sorry, been gone

looks good but its white all the time. Needs to be drk grey until the table row is rolled over

Then do this, change this accordingly:

a.leftNav {
    font-weight: bold;
    [!]color: #888888;[/!]
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    text-decoration: none;
}

<.