...

View Full Version : Making a:hover img NOT underline



SeanWoods
05-02-2009, 10:32 PM
I was told before that to stop my images from being underlined on Firefox when hovering, I need to make it a background image. How exactly is that done? I don't know if it makes it more complicated, but I also have a rollover image. They are the links along the left hand side. http://www.grammarperfection.com/index.html

CSS Code:
a:hover img {
text-decoration: none;
}

There are several image links, but they all have about the same code:

HTML Code:

<h5><a href="../index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Home Rollover','','../Images/home_rollover.jpg',1)">
<img src="../Images/grammar-perfection-home-icon.jpg" name="Home Rollover" width="50" height="50" border="0" id="Home Rollover" /><br />
Home</a></h5>

Excavator
05-03-2009, 12:25 AM
Hello SeanWoods,
You are telling it to underline on :hover right now. In your CSS you have this -


a:hover {
font-weight: normal;
text-decoration: underline;

}

To stop it, change it to this -


a:hover {
font-weight: normal;
text-decoration: none;

}

http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.grammarperfection.com%2Findex.html

...

SeanWoods
05-03-2009, 12:46 AM
Oops! I neglected to mention that I do want all the text links (and in-line text links)to remain underlined, just not the image links. :)

Excavator
05-03-2009, 12:50 AM
I'm sorry. I thought as much but got lazy.
Try this -

#icons {



}

#left a:hover {text-decoration: none;}
a img {
border:none;

}

a:link {
text-decoration: none;
font-weight: normal;
}
a:visited {
text-decoration: none;
font-weight: normal;
}

a:hover {
font-weight: normal;
text-decoration: underline;

}
a:active {
text-decoration: none;
}
a {

You still need to have a look at the errors on your page - http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.grammarperfection.com%2Findex.html

See the links about validating in my sig below.

...

SeanWoods
05-03-2009, 01:11 AM
Wow, what a bunch of errors! I thought it had it pretty good. haha :)

Thanks for helping me with the underline.

I'm still working on the rounded corners on my CSS boxes.

I found a site that creates code for this http://www.roundedcornr.com/ I'm still trying to get it working though.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum