IE repeating background image, FF isn't... HELP!

If you take a look at the image above, the white arrow is pointing towards the IE repeat of the background image. FF doesn't have that issue at all.

Here's the code that's being used for the Front Page Slide Show:

/* --- Slideshow Containers --- */
#fpss-outer-container {border:1px solid #000;overflow:hidden;width:<?php echo $width+$sidebar_width; ?>px;height:<?php echo $height; ?>px;}
/* This element controls the slideshow spacing and border */
#fpss-container {position:relative;margin:0;padding:0;clear:both;width:<?php echo $width+$sidebar_width; ?>px;}
#fpss-slider {float:left;background:none;width:<?php echo $width; ?>px;height:<?php echo $height; ?>px;}
#slide-loading {background:#000 url(loading_black.gif) no-repeat center center;width:<?php echo $width; ?>px;height:<?php echo $height; ?>px;}
#slide-wrapper {display:none;width:<?php echo $width; ?>px;height:<?php echo $height; ?>px;}
#slide-wrapper #slide-outer {height:<?php echo $height; ?>px;}
#slide-wrapper #slide-outer .slide {right:<?php echo $sidebar_width; ?>px;width:<?php echo $width; ?>px;height:<?php echo $height; ?>px;}

/* --- Slideshow Block --- */
#slide-wrapper #slide-outer .slide {position:absolute;overflow:hidden;}
#slide-wrapper #slide-outer .slide .slide-inner {position:relative;margin:0;color:#fff;overflow:hidden;background:#000;text-align:left;z-index:8;height:<?php echo $height; ?>px;}
#slide-wrapper #slide-outer .slide .slide-inner a.fpss_img span span span {background:none;}

Code (markup):

Does anyone have any advice as to how I could fix this IE issue? Looks fine in other browsers tested (Safari, Opera, FF)

 

You most likely incorrectly specified the height. However you can use this code to correct the issue.

.yourClass
{
 background:url("imagePath/imageName.imageExtension") no-repeat;
}

Code (markup):

 

^^ Yes, without the quotes though.

 

You can do that with or without the quotes, both work.

 

Thanks for helping out guys, I gave what you had suggested a shot but it's still having the same issues on IE. I did what you said to the class...

from:

#slide-wrapper #slide-outer .slide .slide-inner a.fpss_img span span span {background:none;}

Code (markup):

to:

#slide-wrapper #slide-outer .slide .slide-inner a.fpss_img span span span {background:url("imagePath/imageName.imageExtension") no-repeat;}

Code (markup):

* I should also note that the front page slide show script automatically determines the height, based off the width of the image.

 

No you have put background:none; that should be changed to background-repeat:no-repeat;

 

Tried that as well... Still not sure what is causing the issue.

 

Could you provide a link to the page please?

I cant find which div is the background image is assigned to

 

Sure:
http://www.5thround.com/testing/wordpress

 

	<div class="slide">
		<div class="slide-inner">
			<a class="fpss_img" href="http://www.5thround.com/testing/wordpress/?p=6958">
				<span>
					<span style="background:url(http://www.5thround.com/wp-content/uploads/2008/08/florian.jpg) background-position: 0 0; no-repeat;">

Code (markup):

That's what I get from your html so you would need to change it to this:

	<div class="slide">
		<div class="slide-inner">
			<a class="fpss_img" href="http://www.5thround.com/testing/wordpress/?p=6958">
				<span>
					<span style="background:url(http://www.5thround.com/wp-content/uploads/2008/08/florian.jpg) background-position: 0 0;background-repeat: no-repeat;">

Code (markup):

basically you have "background-position: 0 0; no-repeat;" where as you should have "background-position: 0 0; background-repeat:no-repeat;"

 

adwebtiser, I gave that a shot as well... Same issue.

 

I'm still trying to mess around to see if I can figure out what the problem is... Bump.