Öncelikle iyi günler.

Ne zaman denesem ya bu şekilde resim gözükmüyor yerine background rengi koyuyor yada div in üzerine bir class olarak eklediğimde resim formatı png olmasına rağmen kenarlarındaki transparan yerler boş gözüküyor.
Bunu nasıl düzeltebilirim.
Örnek olarak kodlar.


/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background-image:url(arka.jpg);
background-attachment:fixed;
background-size:100%;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}

/* remember to define focus styles! */
:focus {
outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}


#header {
position:fixed;
width:100%;
height:45px;
background-image:url(bg.png);
-webkit-box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.75);
box-shadow: 0px 3px 5px 0px rgba(50, 50, 50, 0.75);
}

.headerlogo{
position:absolute;
width:29px;
height:43px;
margin:1px 0 0 50%;
background-image:url(logo.png);
}





HTML: