Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#1 2006-05-11 18:21:39

Michael
Member
From: Vienna/Austria
Registered: 2004-03-25
Posts: 147
Website

Remove this line! (a img - border)

Hi!

I would like my linked text to be nearly white with an orange underline, so I use this command in my css:

.article a { color: #efefef; border-bottom: 1px solid #ff8c00;
}

Now my problem is that if there is an image (img) with a link, this line also appears, no matter what I write into

.article a img or .article img a which seems to make no difference…

Can anyone please tell me how I can remove the border-bottom from the picture without adding a class to the img?

Thanks,
M.

Offline

#2 2006-05-11 21:43:42

NyteOwl
Member
From: Nova Scotia, Canada
Registered: 2005-09-24
Posts: 539

Re: Remove this line! (a img - border)

Try .article a img {border: 0; display: block;}


Obsolescence is just a lack of imagination. / 36-bits Forever! / #include <disclaimer.h>;

Offline

#3 2006-05-11 21:45:34

els
Moderator
From: The Netherlands
Registered: 2004-06-06
Posts: 7,458

Re: Remove this line! (a img - border)

I had the same problem just recently and I tried exactly the same things without success. What worked for me is wrapping the image links in a span class=“noborder”. In the CSS: .noborder a {border: 0:}

Offline

#4 2006-05-11 23:01:56

bancroft
Member
Registered: 2005-09-30
Posts: 39

Re: Remove this line! (a img - border)

You could also try; img a { border: none; }

Last edited by bancroft (2006-05-11 23:03:55)

Offline

#5 2006-05-15 09:07:40

jm
Plugin Author
From: Missoula, MT
Registered: 2005-11-27
Posts: 1,746
Website

Re: Remove this line! (a img - border)

I hate this problem—it took me awhile to figure out the solution for my site. It’s really simple; however, there are a few options:

1. Set a img to display:block (or table, if you prefer..)

.article a img{ border: 0; display: block; }

2. Float the image:

.article a img{border: 0; float: right }

Or you can apply a class to the image, such as .thumb.

3. Post the images in the div itself and not in the paragraph. (hit a space to turn off textile for a paragraph). This is kind of narrow, and sort of pointless though.

Target text-links (primarily):
.article p a,.article li a,.article dl a,.article table a { color: #efefef; border-bottom: 1px solid; }

.article a img { /*your styles here*/ }

Last edited by deldindesign (2006-05-15 09:09:29)

Offline

Board footer

Powered by FluxBB