Click to See Complete Forum and Search --> : How to remove link underline from images?


blogmad
07-06-2007, 06:51 AM
Very basic question I'm sure. I have images on my site that are also links. How can I remove the link underline that appears under the image?

KDLA
07-06-2007, 07:14 AM
Use either an inline style:

<img src="file.jpg" style="text-decoration: none;">

or put this in the <head> section:

<style type="text/css">
a img {text-decoration: none;}
</style>

KDLA

blogmad
07-06-2007, 07:43 AM
I am attaching my stylesheet, if anyone cares to check it...

KDLA
07-06-2007, 07:48 AM
Well, you do have some styles with underlining:

div.entry-content a:hover img.center,div.entry-content a:hover img.alignright,div.entry-content a:hover img.alignleft{border:1px solid #2c384d;}
...
div.entry-content img.center,div.entry-content img.alignright,div.entry-content img.alignleft{border:1px solid #9aa1ae;}

Perhaps there are some missing commas here, or inheritance problems?
KDLA

felgall
07-06-2007, 03:27 PM
img {border:0}

is the more common way of doing this.

WebJoel
07-07-2007, 05:15 PM
blogmad: -sorry, -I started to 'quote' you but added a comment & accidentally 'edited' over your post. I repaired it. :o My opps.

-Didn't change anything.

anyway... :D

-That is one gigantic stylesheet. :) -Haven't seen the site so maybe it is required, but if this is an external CSS page and if this exceeds 40-KB you are looking at more-than three TCP-IP packettes being sent to the user's browser... will slow the page rendering down a few seconds.
-Could stand some serious optimization. :) I see things in there that are re-stated unnecessarily, & repeated. And (smile), it is not necessary to write "div" before every id or class ("#foo" or ".foo" is adequate, no need to state "div#foo" & "div.foo"). The browser will correctly apply the id or class, irregardless if "div" is stated or not. -Saves 6 or 9 bits for every "div" not read. Applied consistantly, savings like this and others can reduce a file-weight by 30-50%.

Also, in your CSS:

.entry-title{
background:transparent url(images/postitlebg.jpg) left no-repeat;
height:36px;
display:block;
white-space:nowrap;
padding:0 0 16px 26px;
colro:#33212F;
}

You mean "color" :)