[nick]

Hi,

I'm *really* stuck on removing the borders from my images... my text links are set to border-bottom: 1px dotted; and any images which are enclosed in an <a> tag also have a border-bottom which i'd like to get rid of.

I'm using the following code for my links:
<a href="page" class="img"><img src="image" alt="alttext" /></a>

I would have thought that the following CSS would have sorted it:
a.img {
border: none;
border-bottom: none;
}

... but it doesn't! I've tried every other combination I can think of but can't get it working... any ideas?

My CSS file is at ... - right at the bottom, if you need to look at that for help.

Cheers,
Nick

[sleepingfish]

Lose the dot.

a img {border-bottom: none;}

[nick]

Just having...
a img {
border-bottom: none;
}
... keeps the border-bottom on the image, and also puts a minging blue border round it too. I've had to add img {border: none;} to get rid of that. You can see what I mean at www.english-in-chester.co.uk.

Nick

[stickmus]

border: 0 ?

[sleepingfish]

Originally Posted by nick

You can see what I mean at www.english-in-chester.co.uk

No I can't, where?

[nick]

Originally Posted by sleepingfish

No I can't, where?

Down the right side, under a 'features' heading is a 'Request a Brochure' image - this has an orange dotted bottom border which turns to grey on mouse over. The 'NICKDAY' logo at the bottom has a grey dotted bottom border which disappears on mouse over. This is only in the 'wonderful' IE 6 - it works fine in Safari and Firefox.

Nick

[sleepingfish]

Oh right, I haven't looked too closely, but I missed your a class "img" the first time.

You could try

a.img img {border:none;}

or add "link" in there as you've used it in your existing css to define your dotted line styling.

If you have to add a class to links, using "img" might not be the best name in case browsers get confused.

( <a href="page" class="img"><img src="image" alt="alttext" /></a> )

The dotted line is there in FireFox as well.

[Brown]

its taking the default a: style.

give it a class of its own.

[Alex]

a.img is saying that any <a> tags with a class of img have no border?

Surely it needs to be

img a
{
border:0;
}

??

[Alex]

hm i gnore that, i think i`m being slow....

Just give it it's own class like brown says

[Brown]

Originally Posted by BoGeYMaN

Just give it it's own class like brown says

don't listen to me.

[nick]

Thanks for your help. I changed the "img" class to "linkimg" which may have been causing the problem... as far as I can tell it works fine in everything apart from Firefox, where for some reason it still dotted underlines the logo in the bottom corner, even though it has the same rules applied to it as the other images, but it's too small a problem to bother about!

Nick