how to remove a blue border around a link?

[omglookitsagoat]

I'm coding a website in html5 and css3. I have an image as a link on the website, but there's a blue box around it in firefox and I can't figure out how to get rid of it.

This is the css3 code:

#nav1
{
border: none;
}

This is the html5 code:

<div id="nav_wrapper"><div id="nav1"><a href="index.html"><img src="images/nav_up/images/navigation_all_01.png" alt="home"/></a></div></div>

 

[hkjeffchan]

img {
border: none;
}

 

[omglookitsagoat]

img {
border: none;
}

yea I was wondering if I needed to apply it to the image instead of the link. Thanks.

 

[Phreaddee]

you did neither you applied it to the div containing the link, but not the link itself.

in any case if you are making a "html5/css3" website, why are you using an image for the menu??? and;

<div id="nav_wrapper">

???

 <nav>

otherwise its just mutton dressed as lamb,
if you're going to make an html5 site then utilise what html5 has to offer, otherwise stick to what you know and make a html4.01 site instead. just changing a doctype may technically make it a html5 site but in reality...