image names are causing problems for background inmage

[jonnyfreak]

i have images set as backgrounds i a div ( thanks to Beverley )


<style type="text/css">
.prod-div{
width: 130px;
height: 130px;
background: no-repeat scroll center center transparent;
margin: 3px;
text-align: center;
border-right-width: 1px;
border-bottom-width: 1px;
border-right-style: solid;
border-bottom-style: solid;
border-right-color: #666;
border-bottom-color: #333;
}

.prod-div img{
}

</style>



<a href="../images/uploads/<?php echo $row_rsCustomer['image']; ?>" rel="lightbox[<?php echo $row_rsCustomer['custID']; ?>]" title="<?php echo $row_rsCustomer['custLocation']; ?>"><div class="prod-div" style="background-image:('images/uploads/thumbs/<?php echo $row_rsCustomer['image']; ?>')"/div><img width="130" height="130" /></div>


but some images that are being uploaded have non text or numerical characters for example 042-Alexandra &amp; Steven-0411373709523.JPG">

so are not showing in the div. i did test and if the characters are removed the images show. How can i get around this happening apart from rename all the images which isnt practical

thanks
Jon

[jscheuer1]

That PHP code makes invalid markup and doesn't assign a background image to anything. So the problem might not be the filenames, try:


<a href="../images/uploads/<?php echo $row_rsCustomer['image']; ?>" rel="lightbox[<?php echo $row_rsCustomer['custID']; ?>]" title="<?php echo $row_rsCustomer['custLocation']; ?>">
<div class="prod-div" style="background-image: url('images/uploads/thumbs/<?php echo $row_rsCustomer['image']; ?>')"></div></a>




There could also be other problems.

The browser cache may need to be cleared and/or the page refreshed to see changes.

Note: In order to get the PHP code to display properly, I had to put a line break in it, that can be removed, probably should be for older browsers which could interpret it as a space.