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 Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

CSS Question

Status
Not open for further replies.

atruhoo

Programmer
Jan 8, 2003
131
US
Pretty new to CSS and having small problem getting CSS to display properly in table. Sure I am doing something so simple it isn't funny. Limited sleep last 24-48 hours doesn't help. CSS shows up on rest of page correctly but in table defaults to original colors set in Body tag. Have tried taking out, but PC defaults take over. Also have attempted changing to class, but it didn't appear to like that either. Code below

<style type=&quot;text/css&quot;>
<!--
a:link {
color: #E2E7F1;
text-decoration: none;
}
a:visited {
color: #E2E7F1
cursor: crosshair;
text-decoration: none;
}
a:active {
color: #E2E7F1;
cursor: crosshair;
text-decoration: none;
}
.nav a:link {
color: &quot;White&quot;
cursor: crosshair;
text-decoration: none;
}
.nav a:visited {
color: &quot;White&quot;
cursor: crosshair;
text-decoration: none;
}
.nav a:active {
color: &quot;White&quot;
cursor: crosshair;
text-decoration: none;
}
-->
</style>

</head>
<body background=&quot;bground2.jpg&quot; link =&quot;#E2E7F1&quot; vlink=&quot;#E2E7F1&quot; alink=&quot;#E2E7F1&quot;>
---More code for page not shown here to include Buttons and links---
<table width=&quot;80%&quot; cellspacing=&quot;0&quot; cellpadding=&quot;0&quot; border=&quot;1&quot; align=&quot;center&quot; >
<tr>
<td bgcolor=&quot;white&quot; align=&quot;center&quot;><a href=&quot;IVX20.html&quot; class=&quot;nav&quot;><img src =&quot;smIVX20.jpg&quot;></a></td>
<td bgcolor=&quot;white&quot;><font face=&quot;VERDANA&quot; font color=&quot;000080&quot;><b>Prod Name</b><br><br>Some verbage.</font></td>
</tr>
<br>
<hr width=&quot;80%&quot; size=&quot;2&quot; color=&quot;#000080&quot;>

 
Hi,

What exactly is the problem? Font color, or link color?

You do have several problems with your css however:

- your link order in the stylesheet is out of order, it should be: a:link then a:active then a:visited then a:hover(if you want hover)
- the pseudo link class &quot;nav&quot; is not correct syntax and is also out of order should be: a.nav:link not nav.a:link
- also the &quot;nav&quot; class is missing a semi-color after the colors and you don't surround your color with quotation marks.

Fix some of those problems and that might be your answer.

Hope this helps!

Nate

mainframe.gif

 
Nate
Problem is link color around image on table. Fixed above except for quotes around color which were only added in a desperate attempt before posting here I just forgot to correct on post. Still having problem with Link in table as being super-ceded (I think) by info in body tag. I tried changing class to a.nav instead of class=&quot;nav&quot; and still no luck. Appreciate the input is there anything else I could try.

Richard
 
&quot;I tried changing class to a.nav instead of class=&quot;nav&quot; and still no luck&quot;

What exactly have you changed, the CSS declaration or the HTML that uses it?

Your problem is that you defined your rules thus:
[tt]
.nav a:link {
color: &quot;White&quot;;
cursor: crosshair;
text-decoration: none;
}
[/tt]
Which says 'Apply these formats to any <a> element contained within some other element which has class=&quot;nav&quot;'. Something like this:
[tt]
<td class=&quot;nav&quot;>
<a href=&quot;mypage.htm&quot;>My Page</a>
</td>
[/tt]
To get your (posted) HTML to work, you need to say 'Apply these formats to any <a> element which has class=&quot;nav&quot;'. As Nate said, you should change your CSS to
[tt]
a.nav:link {
color: &quot;White&quot;;
cursor: crosshair;
text-decoration: none;
}
[/tt]
Of course, the same applies to the :visited and :active pseudo-classes.

-- Chris Hunt
Extra Connections Ltd

The real world's OK for a visit, but you wouldn't want to LIVE there!
 
Chris
I made the changes that Nate said and have tried what you stated as you can see by the snippets of code below. However as I stated previously the Link color does not change to white yet it remains the color of the other defined links. I think it may have something to do with the setting of link attributes in the body tag, But as am fairly new to using CSS could be wrong. Thanks for the help if you notice anything or have further suggestions as to why this won't work let me know.
Richard


a.nav :link {
color: white;
cursor: crosshair;
text-decoration: none;
}
a.nav :active {
color: white;
cursor: crosshair;
text-decoration: none;
}
a.nav :visited {
color: white;
cursor: crosshair;
text-decoration: none;
}

<body background=&quot;bground2.jpg&quot; link =&quot;#E2E7F1&quot; vlink=&quot;#E2E7F1&quot; alink=&quot;#E2E7F1&quot;>

<td bgcolor=&quot;white&quot; align=&quot;center&quot; class=&quot;navlink&quot;><a href=&quot;IVX20.html&quot;><img src =&quot;smIVX20.jpg&quot;></a></td>
 
Okay figured out that problem is not with Text links but only when use images or buttons as links. So now I am really lost as I would assume that a link is just a link no matter whether it is graphical or text.

Richard
 
I figured it out or at least a way that is acceptable. In img tag need to set border to &quot;0&quot; then don't need seperate CSS class

<td bgcolor=&quot;white&quot; align=&quot;center&quot;><a href=&quot;IVX20.html&quot;><img src =&quot;smIVX20.jpg&quot; border=&quot;0&quot;></a></td>
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top