Question

I have the following to display an clickable image (with no border) on a website:

<a href="link"><img src="img" border="0" /></a>

However this is not strict XHTML 1.0 so I changed it too:

<img src="img" class="mystyle" />

And the CSS:

mystyle img
{
    border: 0px;
}

However this only works in Safari & Chrome and does not work in IE & FireFox.

I understand that the w3 validators aren’t necessary but was wondering if anyone has come across this and possibly a fix 🙂

EDIT: Style was a typo, I meant class 😉

Thanks

Answer 1

Needs some changes (i am surprised to hear that it works in any browser, well looks like webkit-based browsers do not put a border around image links, as @Adriano mentioned in his comment)

in Html

<img src="img" class="mystyle" />

because the style attribute is to assign property values directely, and not to reference a css rules. The class attribute is used for that.

and in CSS

.mystyle
{
    border: 0px;
}

because to signify a class rule you put a . to it (# for ids). And we removed the img from there because it would mean that you want to style img tags that are contained in some other element that has the mystyle class.