Jump to content

erikegon@vandestolpe.com

Members
 View Profile  See their activity

  • Posts

    2

  • Joined

  • Last visited

 Content Type 

Everything posted by erikegon@vandestolpe.com

  1. erikegon@vandestolpe.com
    Thanks Deirdre's Dad, I fixed it and also updated the initial post. The correction doesn't alter the behavior, the question's still open.
  2. erikegon@vandestolpe.com
    For a monitoring application there is a list of devices. Each name contains a link to the device's report on it's state. The state of each device may be s0 (normal, nothing to report), s1 (only informational alerts were found), s2 (one or more warnings were found) or s3 (errors). I created a class for each state. The s3 class is indicated with red text in bold. Once an operator has clicked the link the font-weight:bold is removed. Pseudo-class :visited doesn't do what it is supposed to. It doesn't apply font-weight, color. Hovering the link behaves as expected. This behavior is consistent for Firefox, IE, Chrome and Safari.Pseudo-class :link doesn't work as expected. The color is not applied, but the font-weight is. Uncommenting the rule #dblist a.s3:link doesn't change the color, but there IS a border. The behavior is consistent: FF, Chrome, Safari and IE all display my page identical. I must be overlooking something or I declare things in the wrong order (I think :link, :visited, : hover, :active is the correct order), or I do not understand styling links at all. Below is a sample of the code. What is going wrong here? If someone can shed some light or if someone can post *working* code, it would be much appreciated. Thanks,Erik. <html><head> <title> Monitoring </title> <style type="text/css"> * { color : #322D5F; font-family : Verdana; font-size : 10pt; } #dblist { width : 300px; margin : 20px auto; border : 1px solid #ccc; padding : 5px; } #dblist a { padding : 1px 0; display : block; text-decoration : none; } #dblist a.s0 { color : green; } #dblist a.s1 { color : black; } #dblist a.s2 { color : blue; } #dblist a.s2:visited { font-weight : bold; } #dblist a.s3 { color : red; font-weight : bold; }/* #dblist a.s3:link { color : orange; font-weight : normal; border: 3px solid blue; }*/ #dblist a.s3:visited { color : gray; font-weight : normal; } #dblist a:hover { font-weight : normal; color : black; background-color : #eee; } </style></head><body> <div id="dblist"> <div> <a class="s2" link="pChart" href="http://pchart.sourceforge.net" target="_blank"> pChart Server </a> </div> <div> <a class="s3" link="apache2" href="http://httpd.apache.org" target="_blank"> Apache Server </a> </div> <div> <a class="s0" link="MySQL" href="http://www.mysql.com" target="_blank"> MySQL Server </a> </div> </div></body></html>
×
×
  • Create New...