Forum Moderators: not2easy
thanks in advance!
}
.link {
padding: 2px 2px 7px;
float: left;
height: auto;
width: 170px;
margin: 0px;
text-align: center;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #000000;
}
.link a:link {
color: #000000;
border: none;
}
.link a:visited {
color: #000000;
}
.link a:hover {
color: #FF0000;
}
[edited by: eelixduppy at 9:42 pm (utc) on Sep. 15, 2009]
[edit reason] no URLs, please [/edit]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title></title>
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<style type="text/css" media="screen">
.link {
padding: 2px 2px 7px;
float: left;
height: auto;
width: 170px;
margin: 0;
text-align: center;
font: bold 12px Arial, Helvetica, sans-serif;
color: #000;
}
.link a:link {
color: #000;
/*border: none;*/
}
.link a:visited {
color: #000;
}
.link a:hover {
color: #f00;
}
</style>
</head>
<body>
<div class="link"
<p>
<a href="www.example.com/">LINK</a>
</p>
</div>
<!--##########
any idea why the hyperlinks under the thumbnails dont turn red when you hover over them, even though I have them coded to?
-->
</body>
</html>
any ideas? thanks!
but the headings/hyperlinks below each of the thumbnails in the middle content section do NOT change color when hovered over.
I can only go by the CSS provided and the problem specified. Marked it up and no problem.
This brings me back to the question that this raised.
Could you have another declaration with more power that is over-riding this?
It sounds like a yes; directly or indirectly.
Strip the HTML/CSS down to the problem itself. If the solution does not present itself during this process, post the relevant test-ready sample that shows the problem in action and we'll see what is interfering.
a:hover is usually pretty simple. The wrong class may be being called, or the cascade is affecting these other links in a way that you have not anticipated.
.link a:link {
color: #000000;
border: none;
}
.link a:visited {
color: #000000;
}
to
.link a:visited {
color: #000000;
}
.link a:link {
color: #000000;
border: none;
}
Hope this can help you out.
Link psuedo elelements should be in the correct order.
....................
You can shorthand #000000 to #000 also.
