Forum Moderators: not2easy
See? The table's left header is invisible because the colors are the same. I'd like to have this link white or something. How do I do that?
123.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="123.css" rel="stylesheet" type="text/css" />
</head><body>
<p><a href="home.htm">some link!</a></p>
<table width="100%" border="1">
<tr>
<td class="some_table"><a href="link_url.htm">linking header</a></td>
<td class="some_table">header</td>
</tr>
<tr>
<td> </td>
<td>content</td>
</tr>
</table>
</body>
</html>
123.css
@charset "utf-8";a:link {
color: #FF6666;
}
a:visited {
color: #FF6666;
}
a:hover {
color: #00FF00;
}
td.some_table {
background-color: #FF6666;
}
/*td.some_table a:link { color: #FFFFFF; }<< has bad effect!
*/
When you load the page file "123.htm" there's a table with two columns/rows.
At the right column you got the "header" and the "content" words.
On the left column, if you point to it's left area at the header field (the higher row) you'll see a highlighted link (with the text of "linking header").
So far so good.
Now, you didn't see this text when the mouse cursor wasn't on it, because this CSS file ("123.css") sets a link's color to #FF6666, which is also the bg color of class "td.some_table".
I want to be able to set a special color (say white) to any link in a "td.some_table" row, which in my example is the higher row.
When I do something like this for example:
td.some_table a:link { color: #FFFFFF; }
I hope it's clear now.
By the way thanks for taking the time to look into my problem, I appriciate it!
Eli.
NOTE: In this instance, as declared. :link could cause problems in IE. You may need to go with:
td.some_table a {
color: #fff;
}
This wouldn't hurt you anyway because :link causes more troubles and complications that it solves anyway, IMO. Other opinions WILL vary.
IF you don't want {text-decoration: underline;} at all, then just say so in td.some_table a {
I was hoping for a more cleaner solution because when I'll need to change something, I'll need to change it in few places, an hard a dirty way to work (:
I've tried to do
text-decoration: inherit;
but IE 7 doesn't seem to support it! Any way to achieve the same?
Anyway, your solution did work and I really thank you for it!