Hi friends, seems many newbie's like me have faced this problem (source: google) but I'm not able to find a working solution for mine.

NOTE: My web-design partner is out of town, hence asking you guys for help

I have an image link as "Featured Work" in footer area in my wordpress site www.acme.66ghz.com

You will notice that it has underline, which I need to remove. I'm using wordpress widget "Text - Arbitrary text or HTML" and putting the following code in that:

<a rel="prettyPhoto" href="http://www.youtube.com/watch?v=YAClHdPrWi4?width=792&amp;height=600"><img src="http://acme.66ghz.com/wp-content/uploads/2010/04/edi-11.jpg" alt="Featured Work" /></a>

Please give me some solution so that the underline disappears from "Featured Work" image link.

Just sharing if it might help:
http://acme.66ghz.com/wp-content/the...play/style.css
http://acme.66ghz.com/wp-content/the...css/style1.css

- Thanks

CSS:

a img {
    text-decoration: none;
}

Thanks for quick reply, I added ur code at top here:

http://acme.66ghz.com/wp-content/the...css/style1.css

still not working!! sorry but i'm total newbie

add those lines to your stylesheet.css as some of the settings can be overwritten by wordpress itself.

That's because the line isn't applied to any image element, there's a border-bottom being applied to the containing textwidget div.

Find the following code in your stylesheet (around line 235 or so) and remove the border-bottom declaration:

.textwidget a {
   border-bottom: 1px solid #FF9000
}

thanks jamestl2, that works

minor problem is, it underlines while hovering, can any1 plz help me locate that code.

-thanks!!

Right below where you removed the previous border, remove the same border-bottom declaration:

a:hover{
border-bottom: 1px solid #666;
color:#ff9000;
}

once again thanks jamestl2, you dont know how much u hav helped me, u r simply gr8!!

and thx to all those who tried to help...gr8 thx

a small query though, is it possible to underline "read more" links of my homepage acme.66ghz.com

&

you can see that the underline of underlined link on this page http://acme.66ghz.com/portfolio/ does not change color while hovering, is it possible to fix it? of course i have underlined it in wordpress while posting...but it would be great if it changes color to #ff9000 while hovering...

i think my 2nd query might be not possible...but still just asking...

thx once again all... especially James Lewitzke

Yes:

.more-link a {
 text-decoration: underline;
}

And I'm not sure what you're asking for in the second query. Which link are you trying to underline? The "portfolio" heading element?

This time its not working,

my original code was:

.more-link{
background:transparent url(../images/skin1/bullet_orange.png) no-repeat scroll right 15px;
}

and modified as per your suggestion to:

.more-link{
text-decoration: underline;
background:transparent url(../images/skin1/bullet_orange.png) no-repeat scroll right 15px;
}

still not working...help.....thx

No add an entirely new rule, with the anchor selector applied as I showed in post #9:

.more-link a {
 text-decoration: underline;
}

ok i added the code at line 225 here: http://acme.66ghz.com/wp-content/the...css/style1.css

.more-link a {
text-decoration: underline;
}

still no luck

and about that 2nd query, I was talking about the underlined "Print Designing" link, I have underlined it in wordpress while posting, and I want its underline as well to change color to #ff9000 while hovering. No big deal if not possible. Thanks James

It's likely because you have another class conflicting with the given element, try making the class more specific instead:

a.more-link {
 text-decoration: underline;
}

About the print underline, it's remains that color because you're applying the text-decoration property to that given element (a span) and not the specific anchor.

So just remove the inline styling and apply a class to the anchor, then adjust the CSS accordingly.

thx a bunch James, is it possible to keep the underline stay on "read more" link even while hovering? the underline vanishes while hovering. Not that important, but would be great if that can be achieved. Thanks

Just apply the same declaration to the hover pseudo-class:

a.more-link:hover {
 text-decoration: underline;
}

added that code at line 228: http://acme.66ghz.com/wp-content/the...css/style1.css

no luck!!

You sure? It looks fine to me.

I'm sorry, my bad, chrome was showing me cached page. "Read more" thing is sorted. Many thanks

Can you please tell me exactly what I need to do here:

About the print underline, it's remains that color because you're applying the text-decoration property to that given element (a span) and not the specific anchor.

So just remove the inline styling and apply a class to the anchor, then adjust the CSS accordingly.

what lines and where do I add?

There's several ways you can do it. For example, find this code:

<p><span style="text-decoration: underline;"><a href="http://acme.66ghz.com/portfolio/print-designing" target="_self">Print Designing</a></span></p>
<p><span style="text-decoration: underline;"><a href="http://acme.66ghz.com/portfolio/web-designing" target="_self">Web Designing</a></span></p>
<p><span style="text-decoration: underline;"><a href="http://acme.66ghz.com/portfolio/video-production" target="_self">Video Production</a></span></p>

And move the styles to the anchors:

<p><span><a style="text-decoration: underline;" href="http://acme.66ghz.com/portfolio/print-designing" target="_self">Print Designing</a></span></p>
<p><span><a style="text-decoration: underline;" href="http://acme.66ghz.com/portfolio/web-designing" target="_self">Web Designing</a></span></p>
<p><span><a style="text-decoration: underline;" href="http://acme.66ghz.com/portfolio/video-production" target="_self">Video Production</a></span></p>

You might want to just add the style to the CSS though. Remove those previous span style attributes, give the anchors a new class and add the rules to the stylesheet:

.newanchorclass a {
 text-decoration: underline;
}

.newanchorclass a:hover {
 text-decoration: underline;
}