PDA

View Full Version : CSS a:hover problem



themind
09-15-2005, 07:56 PM
Hello all. For some reason (one which I hope somebody can explain to me) a hover in my CSS is not responding. The page is:

http://www.pdmdigital.com/contact.htm

and I'm referring to the link that says "EMAIL US" It is supposed to do exactly as the top nav bar links do, display a 1px solid black border, but does not.

ALSO, why does the text move as you hover over it? And lastly (maybe a CSS pro can help me) why do 'lower' CSS classes/ids effect other classes/ids that have totally different names? Any and all help is greatly appreciated, thanks a lot for taking the time to read this, theMind-

Twey
09-15-2005, 08:05 PM
It works for me.
Mozilla/5.0 (X11; U; Linux i686; en-GB; rv:1.7.10) Gecko/20050831 Firefox/1.0.6

The text moves by 1px as you hover over it in order to incorporate the border. CSS classes can affect one another in two different ways: if two styles are being applied that are incompatible, and if one class inherits behaviour from another.

themind
09-15-2005, 08:41 PM
Twey,

Thanks for taking the time to look. I have IE 6 and the border does not show. The text simply shifts down and that's it. Any insight to why it wouldn't work on IE?

jscheuer1
09-16-2005, 03:56 AM
This is the only relevant style applied to the link represented by the text 'EMAIL US':

.text a:link {
font-family:Georgia, "Times New Roman", Times, serif;
line-height: 120%;
text-decoration: underline;
color:#000000;
}
.text a:hover {
font-family:Georgia, "Times New Roman", Times, serif;
line-height: 120%;
display: block;
color:#000000;
text-decoration: underline;
}Frankly, I don't see any material difference in the link style as opposed to the hover style and saw no difference on the page in either FF or IE.

Twey
09-16-2005, 11:19 AM
It's been changed since the first post. There was code in there to add a border.