alternative links border-bottom and images…

[vladyn]

Hello everyone,
I’m using this technique from a long time and always wondering how to get rid of the remaining border-bottom on the images, which are links:
example

Code:

a:link {
background: inherit;
color: #cf432e;
text-decoration: none;
border-bottom: 1px solid #cf432e;
padding-bottom: .1em;
line-height: 140%;
}

and I don;t want this to affect the image, where I have:

Code:

any ideas ?

[EamonnMac]

Not entirely certain what you need here, so forgive me if I’m wrong, but if it’s a case that you just don’t want any link decoration on an image, just put this in your CSS:

Code:

a { outline: none; text-decoration: none; }
a img { border: none; background: none; }

That’ll remove any borders or backgrounds placed by default by the browser to any image acting as a link. (The first line is to remove decoration from regualr links) You can still style individual images if you give them an ID…

[vladyn]

I’m trying to remove the border style from the images, which are inside A tag

in your example you’ll remove the border from the img tag, but with a {border-bottom: 1px solid #FFF000} you actually applying the border to a A element, which is the parent element in above example

[apostrophe]

Give all of your links with an image a class.
eg.

Code:

and remove the border via that class

Code:

a.image {
border: none;
}

[kamil]

Try this

a.image {
border: 0px;
}

[TheDoc]

"kamil" wrote:

Try this

a.image {
border: 0px;
}

This would not work. The only way that would work is if you <a> had a class of "image". <a class="image">

[Author]

Posts