Log in

View Full Version : Resolved Shouldn't this be blue?


james438
06-06-2011, 11:26 AM
Shouldn't the middle text "#00ffff" here be blue?

<html>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">
<style type="text/css">
a.w:link {
color:blue;
text-decoration: none;
}
a.w:visited {
color:blue;
text-decoration: none;
}
a.w:hover {
color:blue;
text-decoration: none;
}

</style>
</head><body>
<div style='float:right;font:16px;font-family:Courier;text-align:right;border: black 2px solid;padding:12px;'>
<a class='w'><font style='color:#00ffff;'>aqua</font> #00ffff <font style='background-color:00ffff;'>sample </font></a>
</div>

</body>
</html>
Beverleyh
06-06-2011, 11:43 AM
Try chaging 'font' to 'span'

<span style='color:#00ffff;'>aqua</span>
instead of
<font style='color:#00ffff;'>aqua</font>
james438
06-06-2011, 11:51 AM
I made the change, which was probably needed, but I am still having trouble getting the text: #00ffff; to be blue when the mouse is not hovering over the text.

EDIT: It seems I need to use href, but the problem is that I do not want the link to go anywhere. There is some javascript involved that will change the text of the links in a div. It works fine, but when the page first loads the color is always black.
Beverleyh
06-06-2011, 12:46 PM
what about using <a href='#' onclick='return false;' class='w'>?
james438
06-06-2011, 01:22 PM
Awesome, that works great! Thanks :)
jscheuer1
06-06-2011, 02:47 PM
That works when javascript is enabled. If clicked it does nothing. Without javascript enabled clicking it can make the page reload. At the very least it will append # to the URL in the address bar and in the location object.

If you use:


<a href='javascript:void(0);' onclick='return false;' class='w'>

It will do absolutely nothing with or without javascript enabled.

However, the css :hover pseudo-class works with any element, except in IE 6 and less where an anchor link is required. The above will fix it for IE 6 and less. But there are (depending upon the situation) other ways. You cannot nest one anchor link inside another. If what you're doing requires that, you must use an alternate method.