Jump to content

[SOLVED] Hover links not working


jbingman

Recommended Posts

I have a style sheet that contains all the normal link attributes (ex. hover, visited). The hover works fine the first time you select the link but doesnt work anytime after.

If you go to fresnosar.com you'll see what i mean.

Why would it be doing this is there something wrong in my style sheet?

/* CSS Document */

body
{ background:fixed; border:hidden; background-repeat:no-repeat; background-position:center; background-color:#263E50  
}
table
{ background-image:url(images/Untitled-2.gif); border:thin #000000; vertical-align:top 
}
th
{ border-bottom: thin solid #000000
}
h6
{ text-decoration:none; color:#DCDCDC
}
h3
{ text-decoration: none; color:#DCDCDC
}
hr
{ color:#DCDCDC; border: dashed thin
}
p
{ color: #DCDCDC; font-size: 14px; line-height:150%; text-align:inherit
}
a:link
{ color:#DCDCDC; text-decoration:none; font-size:12px
}
a:hover
{ color:#000000; text-decoration:underline 
}
a:visited
{ color:#DCDCDC; text-decoration:none; font-size:12px
}
br
{ line-height:150%
}
div.img
{ margin:2px; height:auto; width:auto; text-align:center
}
p.style1 
{ font-size:15px; font-weight:bold; color:#DCDCDC
}
p.style4
{ font-size:12px; color:#DCDCDC
}
span.style1
{ font-size:24px; font-weight:bold; color:#DCDCDC
}
span.style4
{font-size:2px; color:#DCDCDC
}
ul
{font-size:14px; color:#DCDCDC
}
div.header
{background-color: gray; text-align:left
}
.stylered {
font-size: 12px;
color: #FF0000;
}

 

Link to comment
https://forums.phpfreaks.com/topic/71218-solved-hover-links-not-working/
Share on other sites

As TM says, order is crucial. That was your whole problem. But so is proper declaration.

 

Once you declare a:link and a:hover, you MUST also declare a:visited and a:active. Here is the shorthand version assuming visited and active are the same as link and hover (respectively):

 

a:link, a:visited
{ color:#DCDCDC; text-decoration:none; font-size:12px
}
a:hover, a:active
{ color:#000000; text-decoration:underline 
}

 

The same order, however, STILL applies even if visited and active are not the same as link and hover (respectively):

 

a:link{
color:#DCDCDC; text-decoration:none; font-size:12px
}
a:visited{
color:##DCCCCC; text-decoration:none; font-size:12px
}
a:hover{
color:#000000; text-decoration:underline
}
a:active{
color:#CCCCCC; text-decoration:underline
}

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.