How to remove border arround image

Question

So I have a problem. I'm using sprites for the first time and now around them appear border, I tried to set border:none but it didn't work. demo

<div class="service">
<img href="image/icons.png" style="background-image:url('image/icons.png'); background-position:0 0; height:59px; width:59px; border:none"/>
</div>

.service {
position:relative;
float:left;
clear:left;
border:none;
}

Answer 1

HTML:

<div class="service">
    <img href="image/icons.png" style="background-image:url('image/icons.png'); background-position:0 0; height:59px; width:59px; border:none"/>
</div>

CSS:

.service {
    position:relative;
    float:left;
    clear:left;
    border:0;
}

Answer 2

Get rid of the href, and change your img tag to a div like so:

http://jsfiddle.net/WtaXr/

<div class="service">
    <div style="background-image:url('image/icons.png'); background-position:0 0; height:59px; width:59px; border:none"></div>
</div>

Hope that helps!