How to remove white border around transparent png?

Question

HTML

When overlaying transparent png in html ( watermark , 1 , 2 ) there is a white border where the transparency starts. How to get rid of it?

When overlaying in a graphical editor (Paint.Net), there is no frame:

<style type="text/css">
        .card IMG { position: absolute; }
        .conf-side { z-index: 5;}
        .conf-front { z-index: 2;}
        .conf-background { z-index: 1; }
    </style>

    <p class="card">
        <img id="front-1" src="img/2.png" alt="" class="conf-front" width="800" height="600" />
        <img id="side-1" src="img/1.png" alt="" class="conf-side"  width="800" height="600"/>
        <img src="img/background.jpg" alt="" class="conf-background"  width="800" height="600"/>
    </p>

Answer 1

jsfiddle.net/iiil/DJU9Z/show
There is no border