IE6 PNG transparency issue with image slider controls

Associate
Joined
2 Nov 2007
Posts
488
Hey all,

Im having some troubles with my website (see here). Im using the Nivo Slider and the iepngfix.htc.

The problem is, the PNG fix doesnt seem to like background-position, and i end up with both (transparent) arrows pointing backwards in IE6! (Have a look at this screenshot to see what i mean).

Here is the CSS:
Code:
/* Transparent PNG Fix */
div.nivo-directionNav a, a.nivo-nextNav, a.nivo-prevNav {
	behavior: url('/js/iepngfix.htc')
}

/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
	display:block;
	width:30px;
	height:30px;
	background:url(../images/slider/arrows.png) no-repeat;
	text-indent:-9999px;
	border:0;
	position:absolute;
	top:40%;
	z-index:99;
	cursor:pointer;
}

a.nivo-nextNav {
	background-position:-30px 0;
	right:10px;
}

a.nivo-prevNav {
	left:10px;
}

Any ideas?
 
Thanks for the reply.

Well thats how the plugin was coded so i didnt want to hack around too much with it. But i just split the image into two separate previous and next images and set the background separately - works perfectly.

Thanks for the help
 
Back
Top Bottom